问:
How to set blob url in image source
I get a binary file back from the server and would like to show it in the frontend. I convert my binary file to a blob and use the DOM Sanitizer to create a save URL.

The problem is that the image is not found when I used the blob URL for the image source:

Typescript:

const blob = new Blob([response], { type: 'application/octet-stream' });

const fileData = this.sanitizer.bypassSecurityTrustResourceUrl(window.URL.createObjectURL(blob));
```

<p><strong>HTML:</strong></p>

<pre class="lang-html prettyprint-override"><code>   <img [src]="fileData">
</code>```

Response from Server

```<code>�PNG

IHDR��91tHiCCPICC ProfileH��WXS��[RIh�H ��R�K   �E�*�I �ĘD�ʢ�k���"��;��(v��P��u�`C�M
����������ϙs�S2��t�yRi.�@�$_����"u`���ǗK�qq���������r�E����=�P���8C ��A|��/��@�z�i�R%���&�T��ԸX�3ԸBe�ρxd�'�@�   �Y�,ȣ}bW�@,@�q _�@  )J�C�7<Y����������C�ri.o��َ�-y���vp�D��xeͰowr�D)1
�nIFL,���T��T�"2Im�����3���U�����pInL�F��)�BWZ(��&j|    �a  �jٔ���)�5��<�*����"'���#r���S�9c�qr��3�9    Qj̦Hĉ��)���@�'�D����I���x��,O>P/�H$��hpe�(1Ró��S�oq�P�N���E�"���kǮ
%I�z�vi~H����47Nc�S��J�Ħ��/�������%���3�y����� p@(``
�����n�K=x@���h4)�  �&�"�DB �Q�
A�Ԫ�. S5[���O �Q �V��$�ђ�P#�!:��r�Gj�5�/Kg��F%FÉ��  ������;��d�՞��FxL�Ih'ܝ,�/���a�pM��֌�AVO<���g�&� #�� �j9�̕������Ǝ�JA)C(���=���=Y�=��C�\3����>>�N�=�{Kl�;���.`G�F�cM�e���?T�h Z�*��#�!OS�I�k�k��'�\��P�~�)��2q�(�ņo~!�+��rwu�@�Q��^3U��y�n�������j`��_u�����$��
Y�Z�+/@:�2��8�z܁�� �� ��I��"��e`�   �P��5�l[�����8  ΂K�*�   ����    ����!BB�1F,[�qG|�@$�F�T$�B$���,@ʐ�H%��E~E!'�Hry�t!���(��P��CG�>(�Bщh:-B�ѥhZ��BГ�%�&ڎ>G{1�iaL�s�|0��a�����b�X
V�5���:֎ucp"��Y�\��x�ǧ��%x%�o�O���Gx��@'��  ~.a!�0�PB('l#$��OS'�-�Hd���iL%fg���Oۈ�^�dLr&�bI<R>������t�t��IzO�"[�����4��<�\N�I>F�F~J��Rl)~�X��2������L�B��Q����j"5�:�ZA����ާ���Ҳ����%֚�U��W��#�4}��C�@SЖҶ�N���^��t;z0=��O_J����?���fh��j��hWi7h_�~�Cѱ�a�L�)�)�ٯsE�[��k������֭�=�{[�W�������Do���g�$};�0}�~���S��a��0�����3�N���� ۠�`�A�A����H�d�B�*ã��L�i��2s�˘������
aY<�~ȵ!    �J���4�h�23�1^a�h��7q2k2�d����C����7�wS���4�t���˦�f�ffR�uf�̺͙������wY0,-��-�[��2d�Y��
�iV���e���r�e�e���U��|�=V���>֙֫�[�{l,l��̴���ݖb�c+�]k{�����]��B�F�g�F�\�"�:��t� ��57��>�9���:�N�N"�*�+Ψ����y�s�0�0�a�a5�n��\�..u.��3�G�?�q��6#�F�qn�WO�\׭�����F��wkv{����w�r��A�������r��H��
#�x2<�x.�l�����%�����N�����c����/�7�w���~^~�~����w������l��(ᨭ�:�x��Y�遛ۃ,�xA5A�����ۂ�����]�!�!���!�8~�Y��XhDhihk�~XRXe��p����ψ'" �Q�+"os͸|n-�g���Y�OGѢ�*�G;Eˢ�ǠcF�Y5�~�m�$�1�rcW�>����wx,ql�ت�O���gƟK`$LNؙ�61$qY�$�$ERK�N����w)�)+S�Ǎ7kܥT�TqjS)-9m[Z����k�wN�P2��D���/L2��;��d�ɼ���  �)�;�?�by5��nFuF��_�.�t �+�O32Wf>�
�Z��%
����q��evd���w9�9�s�sSr�����I�%9��ŞNi�:KK��S�����#��m�#��|�a��pP��xTXPU�~Z���z����ӝ�/���(��������3��|4�=k�ldv��9�s��t΍��cu^μ���_9�͂���f�s�;~����D�DVr{����E�E��=�[��TPz�̵�������?��\�s��̥�˼�mXN\.Y~kEЊ+�V��X5fU�j����o�L^s�|d�ƵԵ����M�l�-_��RTy�*�jO�i���w��m�P��lc�Ə�ě�l���PcWS����`˓��[����K�6�me�>o�lo���t�wm�Nӝ���:E]׮ �����T�R�ysO�^�W���_���/j_�~���lTd,m@�7�4�ۛR���>����|����ۏX�:jxt�1��c�ǋ������>�u��er˽S�N�8=�t뙨3�φ�=u�}�����G.�]8t��b�%�K
�=/��^�
W��4]����6��ص�k'��^?{�{��͘�m��nݹ=�v���gws������{s��>�}P���aͿ���ݫ���G�'<����x����O��O�OʟZ<�}���HWx��?����\�����/���_8�8�w�ߗ{��t���������oF�i��}�6�m߻����w|��p�c�ǧ}�>�>U|v���%������~)O�Sm08��L^m��
�*�?�W��T��Ϧ*�V�U�@=�)����.rûr��P���y�����O<������ ���gY�����[a�w81U}�T
�
6+�M#�\������ꯈ  pHYs%%IR$��iTXtXML:com.adobe.xmp<x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="XMP Core 5.4.0">
   <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
      <rdf:Description rdf:about=""
            xmlns:exif="http://ns.adobe.com/exif/1.0/">
         <exif:PixelXDimension>202</exif:PixelXDimension>
         <exif:PixelYDimension>188</exif:PixelYDimension>
      </rdf:Description>
   </rdf:RDF>
</x:xmpmeta>
M�uiDOT^(^^lKgf8IDATx�  �U����l6��  PFPA�)H8b@
CD��J��$�U
TT.��*ZKQ�*<�P,�(��-9� ��9�=fwf��?���9z�gwf���ߵ;����~�������=3��=��M5�h�OAi��T
�5�@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I*�PP�T    4��$P�����@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I*�PP�T    4��$P�����@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I*�PP�T    4��$P�����@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I.�T:�����Y�;űk�*�FPZ#BQPf�����5{�?��&i����ԛP�J|�{|x
<o;�wc~�2��g��/�c��z1��J����7�����J�%P�����whWQ<�   �����mC�
=����ޮ6�vU�,�R�`��m�?����N�"�4�ۡQP�`X��1�����F��S�m�M+0��#�+q$����;�    �bC���#���%��R���9��x��H�f�����@hV�xe5T*}�ހ��&�t��QP�Qê^�~��?�逸��fX������͡5��q-5�UYM�����t0
J�E�gz�a���E��t}e�J���!_>��c&�%�8
�I30
J��������H���\y+��O�,8>�2S��.FA �E41��~��?55ݕ-�a�a>��يO,���YʁQP��d�8I��Y[[4�t����X�t�W�_p"1(�a"F�c�I)0

^u
���;0��Izh�mJe`�t&z�uà��C(˩RX��4M�g5(��
�y?qv���;��{1��O@�Lw�i���L���"ί
j��!0)�.��^�O�En�K;[�HĶ��ȕΆB�ĠԚ~�
xh�m5�M+0��>�6��Lt�gu}A-�ktPm�k

y��&U|��lX
�\ZN�U�����-j=��*iQ���Y�tA�D?J���A�35^�0(�]\�eր҃+��7���Sk�o��2,�����F��(#�E�)(z�f��m���3+@������&�Ui`����o4��q:���)L�A�6ԥ�ޥ�A��=����U�H3������P���W1��w�U
�-�82o�jPde�r��-)�++b�[q��  RguG�Dd�-&��.���e&&�]�z1�N���΃B�=�5�xŬb5�2�Q��V.%�#�.m�2�.�
KW��s�Z#l~�x1�KG���f�<��� ��PA $/#�,]
�ne��o�c��������a�(Bk��}POE�K���#�0�(��0��@��$�3ףbu ���:�����`�r|�a1{�(0C���?L�.����p}(�YnN�#wmz�]���ɮ%�_�7�o#M{//���ϣ�`@�X#`��/�ȹ%��Ȼ��Lz��EKij��+��7%�1��"�7F��J������`�r$Q��כ�y7S�t(�l�iw�l���0�>ڻ�v�
Y�wA\��F+c\1c��zT~��Hi�D
����5�UI�}�d�a8f���?;w�I�Ep5�l{j�R��KӇ+��J=(Y��y���A[z�ϳ.e���Zl�w��N�(o�k�$w<K�A�O&��4��#�����O B���Q�BuA(��
��G`I-(�����Z
�a��B���^�
��л(�HD�-��d�&�a�����0�E�J�ɠl2�Ԃ��m�u_1�<m�J�a�p!{��N��f�Q(�.%0��"�N]���R(��4���:��7
��bi2"�.xp$e�A0؛�k��5en�",uφE<K;`I%(Y�z��w��nû���q�
�7�9b�?
�&4db��b8��QO��%u��78�'us_C�Oὕ�l��F�
�K� ����feRX�~�a�ȍ��&N�������kN_��  ���ؕ
GY�B��2v!tb��_��}LJ@U����@f�$�'�f
(��ٌ~�ט@*v����P<
��)a�����a��K+�ԣ"Db7�%U%�߈s�t�|*����/-���e�I@D"Xd�ቴ
`@��E�Dds힯��}�����h2-�I}��,X�q�ISHD���>�    �$�����Da�ez�]����kK���y���3p�'=/�sH���ʹ��0�T�B�f#F8I�xX��ʶ�mE��K*@�����\�oAz>4�4�2�3w3���M�+����A&����xnd
�0�O(�ޟ��@���P�l3_H��G7"�,&o'�Tǡ�KЋ`&�\507$�+a���`�E�f�J�K��v\*�D �g2)XZ��&���{�A�����|n����4h`g���=�X�A��.��Cf)LG�O��
}�+�R�ۆ��Q�Ɵ�ں���h�s�RX<H�Wq
��B@)b"4p6��J�<�HRڈg�
��D���9TТQ�yP��&�w�H����lt�{�`���}�,�%K�������/�����TW���л>A#�o�8�`]t��N�pH����Q��T����g6�i�F�:u�^��ևv��.���7�@����2�x�����>Xv�x����S���{㚤��V�v�|++�a�p�M6M�A�Y�s.l��5��#��4��&+�4��O8
J�d̦�&�+��~���������k�ŒLƃ�]��?>��@8|y�=�!�'����`0���؛�^�C2r4Ƣ�^�}�+�Q�=����Wq�^�.��E���l���U���g����R�ݫͧ�v�~p�+��w���;��P��N5^����M6̮�E��!�+Y�$I��C0�n��L�]�*9=��4(i��<�� \z��p��rA��l�̏,�k�Y4�8�C�G�2��H<�Xr���3�Л`Q`�!xjoD�X��������&�73+W�w��e�{��G�PI.W����/��-۠X�\�ico�.<�|�
�f3�x��U��;G��GuY@0e���mY�D�&�v��*�3+�X���YP|���ԏء��;�p������ۉQ�z���k`�^n��m�&��D�ɭ��Xgk9@��&L�2�� -�<r�#�ySK�U���o�f�0|���G�uvb���_��f'�`{r���5��~1oҲ�WJp��R��m�L(TCB�X�
Kg���7_xq�]{/��]��R����s-�ei֥ac�Fx�1b���]��8��ɋC!���0�`b/my�b��m|�z�bA���Y�2׿�zw�#u$U(��u[�����#}��a�Ha=>v���!��O�ܵ��xb/��{D������?�[�LW�n|6m���p��㬏.��o�/wpl+���yaK��Ũ�ws���B>�z�˔����p��.7^w�V��e~�k���O�   9�Jw�מ�ő�$Ɲ8�_�n�d��$U����]"��)�0Q�i{3iXl%�l"+Pծ�I&���P[���Sq���m+/�����9[ᗿ~ɍ�$ű�����7����®��e�
�Bll�E���X!{*��@ĥ��-�����D �ꗳ�����w�/�/�W���w��%l��/����ާ��N�?z�~�0��&Yuİ��8���L�\���<��M�z<v\��0(�0���Ð_��I��4nW^q\��#�:=����D������z,a��� �t  .�5.Z
���l��:�?[��I�/'A�xs���⟰��;]�4�]V7'�/l��I6��>�
m2�`K
�%C�$�U��E�����7s��RB�z^B���Ps�#I��0(�����8���x����!,}s�}��v�ūC����x�0�6r6_�a��,�q�%f���N��Fq�T�����&w��%�IDAT�}    ���Y׹˷$���Ӥ�EҔ��@�`-�
��a�ڢ-E
�M�AQ�Zk��"%"Gg��8�ǥ$��N˴j馃4��/߾^��s��r��~�{����s�g;�y��{������<q��FYـG7��^�ǵg?�?���΍,R��s��Zy汿���U�z���0S��J)|q����B�
    n�[٠�^)P�(ͲBKYJ���OR�tO���q�:/��������w�_��勏��/�u���'���v���#��lQ����uI���De~ #��{%~�d��@lV�i%�E���y�"�3��Px��ܴ��X�IFP�k*����#�d�.��C�ӟx����ƅ��屣�AvG�j$p��
d��t$�
�H�?1����'�#T�f�d05��孈�a�:�r��>^~��0
_���k_s{����붫v��/l<�<z��/O^�Y���m�B���_֑����5"(�������y2�3N�f�����?(k+�E�����P�������m��w}u����m�])�s�[?�#���:����7y��:A�
\IOi_+ے�ԉB����h���QAS��况�*�+�k�GP?u�Ly�]�q�kk+�3�����_?�(څ��_R�8��$�Q��g'{�<u�d@0�uDLz�#AǱ��PV0�~OC_�(��1Dr�#P����,�V~CΎ����Ty�]��;��]���˿��^-��g�.O�|��cr�ֈI�l�@Q�&�ˤeG��J��=O~%�19��V�g�~U�cʁ�_)V�s]�:;�Tٿ�|�ï*_���������;�-;ב���9    L`�ք�8��ʷ"�mN�U�Fy��͘l�%乘�k��+�w�FT���~���rD�w�i��-/�/p�8O������W��
f-�9�%0 |j`K~d8q sb@����s�O-����BC�gT�=P�V>S��2�������oz����}�euU�4�0>y��̹/�>1}���ԮK�(���j~�h:̓�Q���۞c��g�z�?j����妵�:FV_��Q����Q�ӯ���<�;����/����e߾�Q����w��7"m]�����b��Q�AY!�z�I@(?x���C�Ӥ�j��(hC����C�o/�+O�ٱU'O�/��������F���������l�'  u~�|��y(vL�|���K
�d0K���k@ʹ+������sK��z�`%u2<�TvPtu(底��}��i�GX�dy��|�����T9{��5����������܏�8}�e�o��D�*ә��g��
DFZP/��e��  '�B�A�+�B)"����W}F  ��_�`9��o�옫����7}�|�sG���_��g>���/<�̿�I�9}o9~���$L�<    <6 ����%��:zh���j���x'(����/�V>����zG^?���/N&د���{����~���|�ho�&��ı����rl4F���t��Np���2�*F�(qc���zJ�ʰ��"��ؗY�<Qz�p
7��-�b<_��q�����^y��}t�ze�/|�
����r���Y���R6���ȑZ����<�M��dF:
(::�%Pj �cN�$}�7?|���5�?}�-���7����?qSN���Sx>9|�'��-�R��S�K5hrh�X�[ʅ0{:����o��r�����֟����ݯ�o{�����n.G����g�3�}}���G�۞s��z���[ݿ�E�ʫ<������S����+����R�B�l(z��p
0&�v����3�����u��L�ߪ<���V��
y?>�x��>{�k�R�=��O�7m�k=F�~��@�!b�'��'�S,��O�9�����|F�[tׯ�o�J��%�}��>_��w?���7����w|e������w���s_^�<�Α�'�(�ޥ�[wM�@ٿ��(o�>��c����-?C��������5���p[[�����������@�䭟���S�i��A����>��N�yͯm��>�|���/���nxƸ�
�(k��gލۮK�\l{�y@���k��ߧ<܋_�������?�?
?;�U^|�寽���_���m8M�z9y������0lv���x���͙�᭟Q�aFM�Xe�<����V?��~��!��_Yy�;�?�:t�z��{�W�������{�A}�My��������?�Jr(�7�9�&@��A�}���(���a�G��������7��X���}嫿ꏔ�}ճ����B�,�0g�_<����-��)�I�$�@iǍ���!Sh{�s�(�+X�Y�o��>��r�̟���@!l��WT<v�'O�MEXE��?��]+�`��r�ڏ���W�e5��=�����WOz�����t����G��:!܆����d����a%�b.)��#��̟� �c��00    �}+������e=��H�8�5��LI�fv�4)Ne+V5)�qҔz1H=�P��3��6iA��w��k'�W�XW
��EZo8~��[֣���s/*O���;6(��A�2q�P���x>�1L    C�*�>�PHz��%0B��;6��*�2�Q�K��<Q�e�bP���>�7��,#��S'�+����P��!P�&&�́Lx/���p�`LJ>��ɟ;8@vwEJ�u���q�ݯ�m��'��]��z�$�I�Hw��)��[�DDW@   ���D0�% .�e��   ش�'��u���3Jw���P��q��w<����O�?���m��L�əѩ�v�\�C��+�Ӄy,Q(��^U6(�����|!R�4*�Щ�>�ו"������_��Ֆe$8r�[�����#F  ^�3����CI�ת
�z
����,I��a��g(�K �Y'J���P
2��
k��,��A]6�2|&y��}J�!H���DB��ۮ�S��L`e<��$�b��I@Lzk� �y�
�U�����;���'G[�����/�����ct�U�-���-��ra&kzV;"�m����@�O3T�"B2J��w�B9��1
�)ٱ^%%��FnQ%o���Q�(tt�
���(�l(�>|
���_J�x���p��J�v��3����J[&}�"�3�Hj  ��"�P0$=!�d�--?S�Vd���Fg�e���/c����D�A���Q�:��,W?����r��wդ�V�lr�p���rY�ZO�!'*�m�喜�)�%(Y�P�A>sv0���z3,;(��l�C��7U�Djg�Ru����co��<    ��ng�|�u��:0xT��a��tܢ $�JP�KA�0PqL_�_������[}�<z��y���6�,Z2�\LK�++�,���49�r�#p�����z+8��{��*�̈́_J[�M~�W�^����4k?�ˎ��tH���s�3�ţY@I�݉B���Ww
�#�Yr|��@��ϔC�~�f��F` ��r����{*C�0����&h��\�E��A��Bڷ�J�*Giٞ:Mh�R�IR�'�5���^t�@���E/ы�e��D����Gq��\H,�+�����'Ͼ�&����&ejG]ؘ�u0���A�(&��Df��a����c���,��f��:ML[�.
֡#���v�ٿ��rþ_l+]�.[�>��r�̟��L�!P��(�C�JKO��^I�٧ �L��0�Mj7�P���l�ӃЇ-�R_ţ�AW-�K��4(!��
K��w7��7�7���������g�Oq�    P3�v䀒�٧ ��L_1�~�佌�)U&N[�O��C�TJ+����c{{8C��Ǡ��SB�j=ppU15_�D���������e{  ��$�q�EM2�IՊ��Q�/�$���O�[�L}�4T�lY�NE�iKI.�9)M�L5g�8��s����Hx}X!�
    ż��_�N��O����W�WT�W�$��$�$N���D��PdbS5�H��*a��%)�"��AȠ�W���{�Q�NSZ�i��8���Eo�,�+��-����;c���n������c�k�·��x��ݢN&��k$�e��&0�� M$5
�h���DY/`$��r݀�Y*���˼e��+�F�IF+ѐ��o�5)�Q>̧s\<����υp�R; 1@���ֱ�V7+�����������$�0����|NBqEs���
��;! �K���v�|����GG")c�d-A�!(����J����[$���%e��N�~�X.�"(Z��T1Lo�_��k�p�Έ@~-��>q.$J`ڊ��mf��
Hp�
�MD)ms�5}D?N�@��1x9�9�.z�%ٱ>�{AĤ�V�������c����A��:��W�,�u��D�o9����s�0�U��D�7�}/!`�п�Ž�xO-m��|��%x?��o  Kc(��3Q�<٧��    N�\E aX��D���CS`�V������B䕂�`H��������߳DL�{�#'����p� a���vAB=e�$ܩ�]v2QEy�۩`KH��H�(<�I&��7    �b=]vP�����\t�()���v�����c���y��y�����Su�Y d�&'I�&��Y�Շ�\�.���V�
P�Z�c5���>��Κe������U@׳����(lq�0���PJ���$����N�g
�ı�I��VjP&O2'e���ٴ��5m�U��Q[�:"F-�{7�l�>�i���Q�~ەϼ͗�f�F��Q'5��ŧ�瀑heީ�%-��0�X�k��o�t� n�>�����ֱ3ߨ?)�˫Q�qM�i���;���� �L%!'�����L��@�$Vp�
�̡��0����6�O���&���<�d��c(\x�]��$t9d6v\�$ʅ�Z�F�p�\�[���ߓ�n��gNy�u����O�k�L� G�I��$�
)�a���6A�9��<�i mR��S�5��ӄ�\aNC�ʎ8Q�r�E�*���h��Řa��X(��7����K��S����3�~�^���Y+�)�4H,::��Lj�(�]�J�
�5O�0�#��F���͉�hh�#�c�1�&�6�Z
s�*wP�4]E�.�Z(�����/����S�!b�S�c���J�^��C�k�)�@��|�:u�����������UY �$��bF�oW��O�,˾�����z2P���7�A�=�:5)0!4W7�f�������<�ͩv̉B�3��XE«����0 �C���A�A)�����gq��NF.}
��(>���p9�Ǆd�a�Sg�N��㟃��)��kˊ�,�_�d0Ť�q�LfȪ�i�-Am�JP`�3�~�(���/ ~�O��
��$t��4M�(�R�e���R��^#I^p�A�P�
!��`���U�ڷn��[�0���4�������Әe�?U�+Z6�A=��>w�-��8n�b>����vz��B9�g)��-z
��2?�c��w�m�N��!8�{4ͭ�0�cϯ��r7AAW���ʎ:Q��LdmP��v�H�.]�%_="P�.qRخ$9��H�tmN��F<ʾ�/�����o"���������Sɺ����[�9<��>�����;���w�~�d8]&f�ek�І"��8y57�h�9"i�S�c63A�o ��'?O/���#���F�r�����`�
9
,Ô�-�5(F�I��d�A�n�t�����$�6����L�<����em�Q�扲���������:�|�Y�i��h��47�S���-���/�g� ��w�\�bp��0��JA�H2�[
��g�0��L5�x���}�K/�bx�5$t��_d�U���G,�?�Kՙ��q'
��y:    ������T�����Ր�B��[�����P�`�T��$�s�0�H��agf�8�ᒔo�Z3���i=�P�Ey��y,f���(����0<��`&��b ����-��I���4g��#��<Aw蟸s� �&sp
,��J��'{����f�vj
P1�.��zN��^qC1������rH])jC�������~�|�@0,�����DDʅ1�$���}u'S�*C��ŞQϼ����E'�r�DpE��^�%_Q����   �wP ��W;���W��0x��m2�S[,T���LA�I1���`M[�j��+Si.Έ���n��������zu똲�">��*�� �&�h���.�T-rR���M���*3ɋ�;(\��S�����Nl�H����E:��v(i+p�Ĝ��QER��6���c�eҭF���l��Tu=�FV5Q�S�"5��&m)�8��.�@|���F�m��  %X�ן$�J�r��Tc���7���t��� �՝�0O�Y�x� v.�cy=!���b��WE�2��{6*X����L�E?Aa8W��
���*g��,��$�&�b�5����M%҇�ʯ�J2
 �4�4%�j�D���S�d$�� �
z<$`�xb��F�w�(�=�?�f,
J��:�$��+��������!iE�z��l��v�˴�i��+zcr5?�4ME了�SȉQ�%<o�hR�x�XCQB��s0�ɪ9--Dt[��^���y��~���@�8��Z��Gal[9�[���!��5tC$Y��;��+9�d�,   Gn1�09"C��
��&�!&K��OA$�3W][M�`V�ce�;��[7����4������Q��X&J>4�![�vRwR��;�ɯ�}20$dH��w�A�E�*�hA�ɮluƀ[#��(͹Y�c��U���@��ʚ����ԣ��4�}7�2Q("QU$�p踫1���p`�m՜/���q�=���/�)�X"�x�Aې��g�����|�HGv
�ܛ��m4y����������
�9��b�Z��>X���U6T�
,N�6��"����ܲ�٦��}���=iǒ���/UTr.�n{�n�=y�0u*a?�i�����$3@d�U��)B�L�N�T�ס�����'2�  �lB�ꊏ:�,�� d��,m
�]��p勁%�ޱ�hA�XV3�F,�
���n��0]0Vl��4McE�����j�/-�2�D�~�\���wI? ��"�ӊl�$�%�Is�z�� H8ݮ
Ԓi�݉�+3K�v�hS�@���4��|G�p!G��)��d1wM��3��u$-�H�^;MuӞ�(6�A��04i:��I���}���y��E��0�y92ӎ�0QtK��J�N�Eck����<�T���ٵ@q�����y���`�i,NtX8����"V��j�Y�   ,ؖ�)*RRϕ�f?/ɔ����1�X_�w�涚k��o��W�b��W��m`   PFB������~�\�Y��Х�"A"�9m:s��
㐉�������D�(|
Nn�����fbknx�E
'Ҷ��P
��l�P�",0Z>�)T��1hr�Ux�m�E�,�B;ZB0-�9�����m�=X��6cF��^�[#5�"%�D��el�Z]��,Վqi�]  ��r��[H�x1  ����6�t<�CxL�6%�d�4 ��"%4��L��iʀ=wP�JB� �b�d�,��˥�r�������x�$@�m��+:��Xt8TdG��k���]:X��4�I��@������S�[�Q�r�B+S�� _&�X���(J��$���(]W{�� |!+l�T���.��Kd���*W)��%XTbq:S��k�Ib���N�
K.b�����M�+��4�L^}=lI\OeNl<��:�,�NS�(�0{PK:�Y�DN~i.OXM��i?��I�p:�h�U&|�8E$1�����@B!0Ԉ�UP�dēC0����ʻL�]�i�`��Ǿ(   `�[�>��p��Uf�.����AN"�hZz���/��$AYh��!�/PR�Z���h�){
�NE�9>��)�b�@P��'"L�SD�Q��� kE�;�B�J(�c�q25�7�+���'�"�j�`IE�?����Oh(����i!C�y�O7���sO��;1�c9pث�L�J`'�δ�fЭ㔜�|����Iϵk�I�չ�a=;u(��V �#{�Dɸgr*���c���=�b���
[,��*�¦���F����L���~{Xe��   ;
H�3�9Ŕ���%��|��m�HAŒ�j}Ψe]�E��Q�͈������y�;{
(ߥ�E�a�[�M��i3��*
b��҇�D���i�ߞq��ii
f/P[SZ�6;�
_�A�e�X��mma-�C;�   �g-���;��#M�p5A"7�ʭ�U�6�ۓ���n̬�U���7�7 �e�20T��

˜�������K(aK�tf��"�(����eC�ū^�4����f�h+d�6H8��;Qj����K�vR[;��DL`�k^'���J
m!�ҠH�p��.Y�;ÕYK�<��=m[d���)�3�֊��gk���'���ǂl)�R���E�_�Ȼ�x�p�,NNnQ$�p��)�+�P-�5[;;��[�ut}�A�+ۀ5m�W,O�%����f>ĜV�m�A��� �x����u��*©�vD��Y�f5�ˋ�xW�ڳ'J�7�±6��3�t��'w�̮H$����Vn�ݓ�ѻb�M�S��3[v����'.�F�<�{�5͔�l.��Ī��Y �S�*ͧj�t�<P��"n� ���YN2r��ޮ��Ϟ���D��t�2�,Q�%���R���AdS����W=j��iMT��Pӎ$Z�^��b��6�d����b�l0�Z�p�����de1�����&��6���^b^����á�D��U�o�_���U�vléS��$tgy�0
]�oq���U�t�`�v=re2-:]�15���A��h��ͻi�o�uV4Ur��İwƬ8?4�獕iz��
Н����3&�D�@�@��"`����M$ �B�;L�IL�u�RS�%��`���D7۰�8G��ʔ��P94(�2�-��7F�е��(�(S`�� ������$1�"+����"E�(�͘>��J��g��=�Ѧ�9kj�Y���hAB�@����xi�����ͪ{��^�Z���V��T���m�
�@�9�?aN�\�v*@r�K�d$6i{�PL�>#ț}�z�ҀрCyO��lfiq^[F�:i?�V6��*  �L�P@K��h�VF�Ye���&�p�������b�>�RfU��N?�L?��fHH��^�0�7G��I�p`��"���x    ���6���f/hz�f&{���If���Tc3:s�6��P�d�@�H\D{Q��<��\��H����������<��?a{�� �����F�@��JIEND�B`�
</code>```

Thanks in advance for your help!!

答:
I only tested this with video, but it should work with images</p>

```<code>     <input type="file" name="file" class="file"id="files"onchange="changefile()"/>

<video style="display: none;" id="vid"src="" width="350px" controls />

</code>```

```<code>    document.querySelector("input[type=file]")
.onchange = function(event) {
  let file = event.target.files[0];
  let blobURL = URL.createObjectURL(file);
  document.querySelector("img").style.display = "block";
  document.querySelector("img").src = blobURL;

}
</code>```

Title: How to set blob url in image source

Body:
I get a binary file back from the server and would like to show it in the frontend. I convert my binary file to a blob and use the DOM Sanitizer to create a save URL.

The problem is that the image is not found when I used the blob URL for the image source:

Typescript:

const blob = new Blob([response], { type: 'application/octet-stream' });

const fileData = this.sanitizer.bypassSecurityTrustResourceUrl(window.URL.createObjectURL(blob));

HTML:

Response from Server

�PNG

IHDR��91tHiCCPICC ProfileH��WXS��[RIh�H ��R�K   �E�*�I �ĘD�ʢ�k���"��;��(v��P��u�`C�M
����������ϙs�S2��t�yRi.�@�$_����"u`���ǗK�qq���������r�E����=�P���8C ��A|��/��@�z�i�R%���&�T��ԸX�3ԸBe�ρxd�'�@�   �Y�,ȣ}bW�@,@�q _�@  )J�C�7<Y����������C�ri.o��َ�-y���vp�D��xeͰowr�D)1
�nIFL,���T��T�"2Im�����3���U�����pInL�F��)�BWZ(��&j|    �a  �jٔ���)�5��<�*����"'���#r���S�9c�qr��3�9    Qj̦Hĉ��)���@�'�D����I���x��,O>P/�H$��hpe�(1Ró��S�oq�P�N���E�"���kǮ
%I�z�vi~H����47Nc�S��J�Ħ��/�������%���3�y����� p@(``
�����n�K=x@���h4)�  �&�"�DB �Q�
A�Ԫ�. S5[���O �Q �V��$�ђ�P#�!:��r�Gj�5�/Kg��F%FÉ��  ������;��d�՞��FxL�Ih'ܝ,�/���a�pM��֌�AVO<���g�&� #�� �j9�̕������Ǝ�JA)C(���=���=Y�=��C�\3����>>�N�=�{Kl�;���.`G�F�cM�e���?T�h Z�*��#�!OS�I�k�k��'�\��P�~�)��2q�(�ņo~!�+��rwu�@�Q��^3U��y�n�������j`��_u�����$��
Y�Z�+/@:�2��8�z܁�� �� ��I��"��e`�   �P��5�l[�����8  ΂K�*�   ����    ����!BB�1F,[�qG|�@$�F�T$�B$���,@ʐ�H%��E~E!'�Hry�t!���(��P��CG�>(�Bщh:-B�ѥhZ��BГ�%�&ڎ>G{1�iaL�s�|0��a�����b�X
V�5���:֎ucp"��Y�\��x�ǧ��%x%�o�O���Gx��@'��  ~.a!�0�PB('l#$��OS'�-�Hd���iL%fg���Oۈ�^�dLr&�bI<R>������t�t��IzO�"[�����4��<�\N�I>F�F~J��Rl)~�X��2������L�B��Q����j"5�:�ZA����ާ���Ҳ����%֚�U��W��#�4}��C�@SЖҶ�N���^��t;z0=��O_J����?���fh��j��hWi7h_�~�Cѱ�a�L�)�)�ٯsE�[��k������֭�=�{[�W�������Do���g�$};�0}�~���S��a��0�����3�N���� ۠�`�A�A����H�d�B�*ã��L�i��2s�˘������
aY<�~ȵ!    �J���4�h�23�1^a�h��7q2k2�d����C����7�wS���4�t���˦�f�ffR�uf�̺͙������wY0,-��-�[��2d�Y��
�iV���e���r�e�e���U��|�=V���>֙֫�[�{l,l��̴���ݖb�c+�]k{�����]��B�F�g�F�\�"�:��t� ��57��>�9���:�N�N"�*�+Ψ����y�s�0�0�a�a5�n��\�..u.��3�G�?�q��6#�F�qn�WO�\׭�����F��wkv{����w�r��A�������r��H��
#�x2<�x.�l�����%�����N�����c����/�7�w���~^~�~����w������l��(ᨭ�:�x��Y�遛ۃ,�xA5A�����ۂ�����]�!�!���!�8~�Y��XhDhihk�~XRXe��p����ψ'" �Q�+"os͸|n-�g���Y�OGѢ�*�G;Eˢ�ǠcF�Y5�~�m�$�1�rcW�>����wx,ql�ت�O���gƟK`$LNؙ�61$qY�$�$ERK�N����w)�)+S�Ǎ7kܥT�TqjS)-9m[Z����k�wN�P2��D���/L2��;��d�ɼ���  �)�;�?�by5��nFuF��_�.�t �+�O32Wf>�
�Z��%
����q��evd���w9�9�s�sSr�����I�%9��ŞNi�:KK��S�����#��m�#��|�a��pP��xTXPU�~Z���z����ӝ�/���(��������3��|4�=k�ldv��9�s��t΍��cu^μ���_9�͂���f�s�;~����D�DVr{����E�E��=�[��TPz�̵�������?��\�s��̥�˼�mXN\.Y~kEЊ+�V��X5fU�j����o�L^s�|d�ƵԵ����M�l�-_��RTy�*�jO�i���w��m�P��lc�Ə�ě�l���PcWS����`˓��[����K�6�me�>o�lo���t�wm�Nӝ���:E]׮ �����T�R�ysO�^�W���_���/j_�~���lTd,m@�7�4�ۛR���>����|����ۏX�:jxt�1��c�ǋ������>�u��er˽S�N�8=�t뙨3�φ�=u�}�����G.�]8t��b�%�K
�=/��^�
W��4]����6��ص�k'��^?{�{��͘�m��nݹ=�v���gws������{s��>�}P���aͿ���ݫ���G�'<����x����O��O�OʟZ<�}���HWx��?����\�����/���_8�8�w�ߗ{��t���������oF�i��}�6�m߻����w|��p�c�ǧ}�>�>U|v���%������~)O�Sm08��L^m��
�*�?�W��T��Ϧ*�V�U�@=�)����.rûr��P���y�����O<������ ���gY�����[a�w81U}�T
�
6+�M#�\������ꯈ  pHYs%%IR$��iTXtXML:com.adobe.xmp<x:xmpmeta xmlns:x="adobe:ns:meta/" x:xmptk="XMP Core 5.4.0">
   <rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#">
      <rdf:Description rdf:about=""
            xmlns:exif="http://ns.adobe.com/exif/1.0/">
         <exif:PixelXDimension>202</exif:PixelXDimension>
         <exif:PixelYDimension>188</exif:PixelYDimension>
      </rdf:Description>
   </rdf:RDF>
</x:xmpmeta>
M�uiDOT^(^^lKgf8IDATx�  �U����l6��  PFPA�)H8b@
CD��J��$�U
TT.��*ZKQ�*<�P,�(��-9� ��9�=fwf��?���9z�gwf���ߵ;����~�������=3��=��M5�h�OAi��T
�5�@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I*�PP�T    4��$P�����@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I*�PP�T    4��$P�����@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I*�PP�T    4��$P�����@
((  ��"�Em@5�@
J%��j@AQP
$Ѐ��@I.�T:�����Y�;űk�*�FPZ#BQPf�����5{�?��&i����ԛP�J|�{|x
<o;�wc~�2��g��/�c��z1��J����7�����J�%P�����whWQ<�   �����mC�
=����ޮ6�vU�,�R�`��m�?����N�"�4�ۡQP�`X��1�����F��S�m�M+0��#�+q$����;�    �bC���#���%��R���9��x��H�f�����@hV�xe5T*}�ހ��&�t��QP�Qê^�~��?�逸��fX������͡5��q-5�UYM�����t0
J�E�gz�a���E��t}e�J���!_>��c&�%�8
�I30
J��������H���\y+��O�,8>�2S��.FA �E41��~��?55ݕ-�a�a>��يO,���YʁQP��d�8I��Y[[4�t����X�t�W�_p"1(�a"F�c�I)0

^u
���;0��Izh�mJe`�t&z�uà��C(˩RX��4M�g5(��
�y?qv���;��{1��O@�Lw�i���L���"ί
j��!0)�.��^�O�En�K;[�HĶ��ȕΆB�ĠԚ~�
xh�m5�M+0��>�6��Lt�gu}A-�ktPm�k

y��&U|��lX
�\ZN�U�����-j=��*iQ���Y�tA�D?J���A�35^�0(�]\�eր҃+��7���Sk�o��2,�����F��(#�E�)(z�f��m���3+@������&�Ui`����o4��q:���)L�A�6ԥ�ޥ�A��=����U�H3������P���W1��w�U
�-�82o�jPde�r��-)�++b�[q��  RguG�Dd�-&��.���e&&�]�z1�N���΃B�=�5�xŬb5�2�Q��V.%�#�.m�2�.�
KW��s�Z#l~�x1�KG���f�<��� ��PA $/#�,]
�ne��o�c��������a�(Bk��}POE�K���#�0�(��0��@��$�3ףbu ���:�����`�r|�a1{�(0C���?L�.����p}(�YnN�#wmz�]���ɮ%�_�7�o#M{//���ϣ�`@�X#`��/�ȹ%��Ȼ��Lz��EKij��+��7%�1��"�7F��J������`�r$Q��כ�y7S�t(�l�iw�l���0�>ڻ�v�
Y�wA\��F+c\1c��zT~��Hi�D
����5�UI�}�d�a8f���?;w�I�Ep5�l{j�R��KӇ+��J=(Y��y���A[z�ϳ.e���Zl�w��N�(o�k�$w<K�A�O&��4��#�����O B���Q�BuA(��
��G`I-(�����Z
�a��B���^�
��л(�HD�-��d�&�a�����0�E�J�ɠl2�Ԃ��m�u_1�<m�J�a�p!{��N��f�Q(�.%0��"�N]���R(��4���:��7
��bi2"�.xp$e�A0؛�k��5en�",uφE<K;`I%(Y�z��w��nû���q�
�7�9b�?
�&4db��b8��QO��%u��78�'us_C�Oὕ�l��F�
�K� ����feRX�~�a�ȍ��&N�������kN_��  ���ؕ
GY�B��2v!tb��_��}LJ@U����@f�$�'�f
(��ٌ~�ט@*v����P<
��)a�����a��K+�ԣ"Db7�%U%�߈s�t�|*����/-���e�I@D"Xd�ቴ
`@��E�Dds힯��}�����h2-�I}��,X�q�ISHD���>�    �$�����Da�ez�]����kK���y���3p�'=/�sH���ʹ��0�T�B�f#F8I�xX��ʶ�mE��K*@�����\�oAz>4�4�2�3w3���M�+����A&����xnd
�0�O(�ޟ��@���P�l3_H��G7"�,&o'�Tǡ�KЋ`&�\507$�+a���`�E�f�J�K��v\*�D �g2)XZ��&���{�A�����|n����4h`g���=�X�A��.��Cf)LG�O��
}�+�R�ۆ��Q�Ɵ�ں���h�s�RX<H�Wq
��B@)b"4p6��J�<�HRڈg�
��D���9TТQ�yP��&�w�H����lt�{�`���}�,�%K�������/�����TW���л>A#�o�8�`]t��N�pH����Q��T����g6�i�F�:u�^��ևv��.���7�@����2�x�����>Xv�x����S���{㚤��V�v�|++�a�p�M6M�A�Y�s.l��5��#��4��&+�4��O8
J�d̦�&�+��~���������k�ŒLƃ�]��?>��@8|y�=�!�'����`0���؛�^�C2r4Ƣ�^�}�+�Q�=����Wq�^�.��E���l���U���g����R�ݫͧ�v�~p�+��w���;��P��N5^����M6̮�E��!�+Y�$I��C0�n��L�]�*9=��4(i��<�� \z��p��rA��l�̏,�k�Y4�8�C�G�2��H<�Xr���3�Л`Q`�!xjoD�X��������&�73+W�w��e�{��G�PI.W����/��-۠X�\�ico�.<�|�
�f3�x��U��;G��GuY@0e���mY�D�&�v��*�3+�X���YP|���ԏء��;�p������ۉQ�z���k`�^n��m�&��D�ɭ��Xgk9@��&L�2�� -�<r�#�ySK�U���o�f�0|���G�uvb���_��f'�`{r���5��~1oҲ�WJp��R��m�L(TCB�X�
Kg���7_xq�]{/��]��R����s-�ei֥ac�Fx�1b���]��8��ɋC!���0�`b/my�b��m|�z�bA���Y�2׿�zw�#u$U(��u[�����#}��a�Ha=>v���!��O�ܵ��xb/��{D������?�[�LW�n|6m���p��㬏.��o�/wpl+���yaK��Ũ�ws���B>�z�˔����p��.7^w�V��e~�k���O�   9�Jw�מ�ő�$Ɲ8�_�n�d��$U����]"��)�0Q�i{3iXl%�l"+Pծ�I&���P[���Sq���m+/�����9[ᗿ~ɍ�$ű�����7����®��e�
�Bll�E���X!{*��@ĥ��-�����D �ꗳ�����w�/�/�W���w��%l��/����ާ��N�?z�~�0��&Yuİ��8���L�\���<��M�z<v\��0(�0���Ð_��I��4nW^q\��#�:=����D������z,a��� �t  .�5.Z
���l��:�?[��I�/'A�xs���⟰��;]�4�]V7'�/l��I6��>�
m2�`K
�%C�$�U��E�����7s��RB�z^B���Ps�#I��0(�����8���x����!,}s�}��v�ūC����x�0�6r6_�a��,�q�%f���N��Fq�T�����&w��%�IDAT�}    ���Y׹˷$���Ӥ�EҔ��@�`-�
��a�ڢ-E
�M�AQ�Zk��"%"Gg��8�ǥ$��N˴j馃4��/߾^��s��r��~�{����s�g;�y��{������<q��FYـG7��^�ǵg?�?���΍,R��s��Zy汿���U�z���0S��J)|q����B�
    n�[٠�^)P�(ͲBKYJ���OR�tO���q�:/��������w�_��勏��/�u���'���v���#��lQ����uI���De~ #��{%~�d��@lV�i%�E���y�"�3��Px��ܴ��X�IFP�k*����#�d�.��C�ӟx����ƅ��屣�AvG�j$p��
d��t$�
�H�?1����'�#T�f�d05��孈�a�:�r��>^~��0
_���k_s{����붫v��/l<�<z��/O^�Y���m�B���_֑����5"(�������y2�3N�f�����?(k+�E�����P�������m��w}u����m�])�s�[?�#���:����7y��:A�
\IOi_+ے�ԉB����h���QAS��况�*�+�k�GP?u�Ly�]�q�kk+�3�����_?�(څ��_R�8��$�Q��g'{�S��2�������oz����}�euU�4�0>y��̹/�>1}���ԮK�(���j~�h:̓�Q���۞c��g�z�?j����妵�:FV_��Q����Q�ӯ���<�;����/����e߾�Q����w��7"m]�����b��Q�AY!�z�I@(?x���C�Ӥ�j��(hC����C�o/�+O�ٱU'O�/��������F���������l�'  u~�|��y(vL�|���K
�d0K���k@ʹ+������sK��z�`%u2<�TvPtu(底��}��i�GX�dy��|�����T9{��5����������܏�8}�e�o��D�*ә��g��
DFZP/��e��  '�B�A�+�B)"����W}F  ��_�`9��o�옫����7}�|�sG���_��g>���/<�̿�I�9}o9~���$L�<    <6 ����%��:zh���j���x'(����/�V>����zG^?���/N&د���{����~���|�ho�&��ı����rl4F���t��Np���2�*F�(qc���zJ�ʰ��"��ؗY�<Qz�p
7��-�b<_��q�����^y��}t�ze�/|�
����r���Y���R6���ȑZ����<�M��dF:
(::�%Pj �cN�$}�7?|���5�?}�-���7����?qSN���Sx>9|�'��-�R��S�K5hrh�X�[ʅ0{:����o��r�����֟����ݯ�o{�����n.G����g�3�}}���G�۞s��z���[ݿ�E�ʫ<������S����+����R�B�l(z��p
0&�v����3�����u��L�ߪ<���V��
y?>�x��>{�k�R�=��O�7m�k=F�~��@�!b�'��'�S,��O�9�����|F�[tׯ�o�J��%�}��>_��w?���7����w|e������w���s_^�<�Α�'�(�ޥ�[wM�@ٿ��(o�>��c����-?C��������5���p[[�����������@�䭟���S�i��A����>��N�yͯm��>�|���/���nxƸ�
�(k��gލۮK�\l{�y@���k��ߧ<܋_�������?�?
?;�U^|�寽���_���m8M�z9y������0lv���x���͙�᭟Q�aFM�Xe�<����V?��~��!��_Yy�;�?�:t�z��{�W�������{�A}�My��������?�Jr(�7�9�&@��A�}���(���a�G��������7��X���}嫿ꏔ�}ճ����B�,�0g�_<����-��)�I�$�@iǍ���!Sh{�s�(�+X�Y�o��>��r�̟���@!l��WT<v�'O�MEXE��?��]+�`��r�ڏ���W�e5��=�����WOz�����t����G��:!܆����d����a%�b.)��#��̟� �c��00    �}+������e=��H�8�5��LI�fv�4)Ne+V5)�qҔz1H=�P��3��6iA��w��k'�W�XW
��EZo8~��[֣���s/*O���;6(��A�2q�P���x>�1L    C�*�>�PHz��%0B��;6��*�2�Q�K��<Q�e�bP���>�7��,#��S'�+����P��!P�&&�́Lx/���p�`LJ>��ɟ;8@vwEJ�u���q�ݯ�m��'��]��z�$�I�Hw��)��[�DDW@   ���D0�% .�e��   ش�'��u���3Jw���P��q��w<����O�?���m��L�əѩ�v�\�C��+�Ӄy,Q(��^U6(�����|!R�4*�Щ�>�ו"������_��Ֆe$8r�[�����#F  ^�3����CI�ת
�z
����,I��a��g(�K �Y'J���P
2��
k��,��A]6�2|&y��}J�!H���DB��ۮ�S��L`e<��$�b��I@Lzk� �y�
�U�����;���'G[�����/�����ct�U�-���-��ra&kzV;"�m����@�O3T�"B2J��w�B9��1
�)ٱ^%%��FnQ%o���Q�(tt�
���(�l(�>|
���_J�x���p��J�v��3����J[&}�"�3�Hj  ��"�P0$=!�d�--?S�Vd���Fg�e���/c����D�A���Q�:��,W?����r��wդ�V�lr�p���rY�ZO�!'*�m�喜�)�%(Y�P�A>sv0���z3,;(��l�C��7U�Djg�Ru����co��<    ��ng�|�u��:0xT��a��tܢ $�JP�KA�0PqL_�_������[}�<z��y���6�,Z2�\LK�++�,���49�r�#p�����z+8��{��*�̈́_J[�M~�W�^����4k?�ˎ��tH���s�3�ţY@I�݉B���Ww
�#�Yr|��@��ϔC�~�f��F` ��r����{*C�0����&h��\�E��A��Bڷ�J�*Giٞ:Mh�R�IR�'�5���^t�@���E/ы�e��D����Gq��\H,�+�����'Ͼ�&����&ejG]ؘ�u0���A�(&��Df��a����c���,��f��:ML[�.
֡#���v�ٿ��rþ_l+]�.[�>��r�̟��L�!P��(�C�JKO��^I�٧ �L��0�Mj7�P���l�ӃЇ-�R_ţ�AW-�K��4(!��
K��w7��7�7���������g�Oq�    P3�v䀒�٧ ��L_1�~�佌�)U&N[�O��C�TJ+����c{{8C��Ǡ��SB�j=ppU15_�D���������e{  ��$�q�EM2�IՊ��Q�/�$���O�[�L}�4T�lY�NE�iKI.�9)M�L5g�8��s����Hx}X!�
    ż��_�N��O����W�WT�W�$��$�$N���D��PdbS5�H��*a��%)�"��AȠ�W���{�Q�NSZ�i��8���Eo�,�+��-����;c���n������c�k�·��x��ݢN&��k$�e��&0�� M$5
�h���DY/`$��r݀�Y*���˼e��+�F�IF+ѐ��o�5)�Q>̧s\<����υp�R; 1@���ֱ�V7+�����������$�0����|NBqEs���
��;! �K���v�|����GG")c�d-A�!(����J����[$���%e��N�~�X.�"(Z��T1Lo�_��k�p�Έ@~-��>q.$J`ڊ��mf��
Hp�
�MD)ms�5}D?N�@��1x9�9�.z�%ٱ>�{AĤ�V�������c����A��:��W�,�u��D�o9����s�0�U��D�7�}/!`�п�Ž�xO-m��|��%x?��o  Kc(��3Q�<٧��    N�\E aX��D���CS`�V������B䕂�`H��������߳DL�{�#'����p� a���vAB=e�$ܩ�]v2QEy�۩`KH��H�(<�I&��7    �b=]vP�����\t�()���v�����c���y��y�����Su�Y d�&'I�&��Y�Շ�\�.���V�
P�Z�c5���>��Κe������U@׳����(lq�0���PJ���$����N�g
�ı�I��VjP&O2'e���ٴ��5m�U��Q[�:"F-�{7�l�>�i���Q�~ەϼ͗�f�F��Q'5��ŧ�瀑heީ�%-��0�X�k��o�t� n�>�����ֱ3ߨ?)�˫Q�qM�i���;���� �L%!'�����L��@�$Vp�
�̡��0����6�O���&���<�d��c(\x�]��$t9d6v\�$ʅ�Z�F�p�\�[���ߓ�n��gNy�u����O�k�L� G�I��$�
)�a���6A�9��<�i mR��S�5��ӄ�\aNC�ʎ8Q�r�E�*���h��Řa��X(��7����K��S����3�~�^���Y+�)�4H,::��Lj�(�]�J�
�5O�0�#��F���͉�hh�#�c�1�&�6�Z
s�*wP�4]E�.�Z(�����/����S�!b�S�c���J�^��C�k�)�@��|�:u�����������UY �$��bF�oW��O�,˾�����z2P���7�A�=�:5)0!4W7�f�������<�ͩv̉B�3��XE«����0 �C���A�A)�����gq��NF.}
��(>���p9�Ǆd�a�Sg�N��㟃��)��kˊ�,�_�d0Ť�q�LfȪ�i�-Am�JP`�3�~�(���/ ~�O��
��$t��4M�(�R�e���R��^#I^p�A�P�
!��`���U�ڷn��[�0���4�������Әe�?U�+Z6�A=��>w�-��8n�b>����vz��B9�g)��-z
��2?�c��w�m�N��!8�{4ͭ�0�cϯ��r7AAW���ʎ:Q��LdmP��v�H�.]�%_="P�.qRخ$9��H�tmN��F<ʾ�/�����o"���������Sɺ����[�9<��>�����;���w�~�d8]&f�ek�І"��8y57�h�9"i�S�c63A�o ��'?O/���#���F�r�����`�
9
,Ô�-�5(F�I��d�A�n�t�����$�6����L�<����em�Q�扲���������:�|�Y�i��h��47�S���-���/�g� ��w�\�bp��0��JA�H2�[
��g�0��L5�x���}�K/�bx�5$t��_d�U���G,�?�Kՙ��q'
��y:    ������T�����Ր�B��[�����P�`�T��$�s�0�H��agf�8�ᒔo�Z3���i=�P�Ey��y,f���(����0<��`&��b ����-��I���4g��#��<Aw蟸s� �&sp
,��J��'{����f�vj
P1�.��zN��^qC1������rH])jC�������~�|�@0,�����DDʅ1�$���}u'S�*C��ŞQϼ����E'�r�DpE��^�%_Q����   �wP ��W;���W��0x��m2�S[,T���LA�I1���`M[�j��+Si.Έ���n��������zu똲�">��*�� �&�h���.�T-rR���M���*3ɋ�;(\��S�����Nl�H����E:��v(i+p�Ĝ��QER��6���c�eҭF���l��Tu=�FV5Q�S�"5��&m)�8��.�@|���F�m��  %X�ן$�J�r��Tc���7���t��� �՝�0O�Y�x� v.�cy=!���b��WE�2��{6*X����L�E?Aa8W��
���*g��,��$�&�b�5����M%҇�ʯ�J2
 �4�4%�j�D���S�d$�� �
z<$`�xb��F�w�(�=�?�f,
J��:�$��+��������!iE�z��l��v�˴�i��+zcr5?�4ME了�SȉQ�%<o�hR�x�XCQB��s0�ɪ9--Dt[��^���y��~���@�8��Z��Gal[9�[���!��5tC$Y��;��+9�d�,   Gn1�09"C��
��&�!&K��OA$�3W][M�`V�ce�;��[7����4������Q��X&J>4�![�vRwR��;�ɯ�}20$dH��w�A�E�*�hA�ɮluƀ[#��(͹Y�c��U���@��ʚ����ԣ��4�}7�2Q("QU$�p踫1���p`�m՜/���q�=���/�)�X"�x�Aې��g�����|�HGv
�ܛ��m4y����������
�9��b�Z��>X���U6T�
,N�6��"����ܲ�٦��}���=iǒ���/UTr.�n{�n�=y�0u*a?�i�����$3@d�U��)B�L�N�T�ס�����'2�  �lB�ꊏ:�,�� d��,m
�]��p勁%�ޱ�hA�XV3�F,�
���n��0]0Vl��4McE�����j�/-�2�D�~�\���wI? ��"�ӊl�$�%�Is�z�� H8ݮ
Ԓi�݉�+3K�v�hS�@���4��|G�p!G��)��d1wM��3��u$-�H�^;MuӞ�(6�A��04i:��I���}���y��E��0�y92ӎ�0QtK��J�N�Eck����<�T���ٵ@q�����y���`�i,NtX8����"V��j�Y�   ,ؖ�)*RRϕ�f?/ɔ����1�X_�w�涚k��o��W�b��W��m`   PFB������~�\�Y��Х�"A"�9m:s��
㐉�������D�(|
Nn�����fbknx�E
'Ҷ��P
��l�P�",0Z>�)T��1hr�Ux�m�E�,�B;ZB0-�9�����m�=X��6cF��^�[#5�"%�D��el�Z]��,Վqi�]  ��r��[H�x1  ����6�t<�CxL�6%�d�4 ��"%4��L��iʀ=wP�JB� �b�d�,��˥�r�������x�$@�m��+:��Xt8TdG��k���]:X��4�I��@������S�[�Q�r�B+S�� _&�X���(J��$���(]W{�� |!+l�T���.��Kd���*W)��%XTbq:S��k�Ib���N�
K.b�����M�+��4�L^}=lI\OeNl<��:�,�NS�(�0{PK:�Y�DN~i.OXM��i?��I�p:�h�U&|�8E$1�����@B!0Ԉ�UP�dēC0����ʻL�]�i�`��Ǿ(   `�[�>��p��Uf�.����AN"�hZz���/��$AYh��!�/PR�Z���h�){
�NE�9>��)�b�@P��'"L�SD�Q��� kE�;�B�J(�c�q25�7�+���'�"�j�`IE�?����Oh(����i!C�y�O7���sO��;1�c9pث�L�J`'�δ�fЭ㔜�|����Iϵk�I�չ�a=;u(��V �#{�Dɸgr*���c���=�b���
[,��*�¦���F����L���~{Xe��   ;
H�3�9Ŕ���%��|��m�HAŒ�j}Ψe]�E��Q�͈������y�;{
(ߥ�E�a�[�M��i3��*
b��҇�D���i�ߞq��ii
f/P[SZ�6;�
_�A�e�X��mma-�C;�   �g-���;��#M�p5A"7�ʭ�U�6�ۓ���n̬�U���7�7 �e�20T��

˜�������K(aK�tf��"�(����eC�ū^�4����f�h+d�6H8��;Qj����K�vR[;��DL`�k^'���J
m!�ҠH�p��.Y�;ÕYK�<��=m[d���)�3�֊��gk���'���ǂl)�R���E�_�Ȼ�x�p�,NNnQ$�p��)�+�P-�5[;;��[�ut}�A�+ۀ5m�W,O�%����f>ĜV�m�A��� �x����u��*©�vD��Y�f5�ˋ�xW�ڳ'J�7�±6��3�t��'w�̮H$����Vn�ݓ�ѻb�M�S��3[v����'.�F�<�{�5͔�l.��Ī��Y �S�*ͧj�t�<P��"n� ���YN2r��ޮ��Ϟ���D��t�2�,Q�%���R���AdS����W=j��iMT��Pӎ$Z�^��b��6�d����b�l0�Z�p�����de1�����&��6���^b^����á�D��U�o�_���U�vléS��$tgy�0
]�oq���U�t�`�v=re2-:]�15���A��h��ͻi�o�uV4Ur��İwƬ8?4�獕iz��
Н����3&�D�@�@��"`����M$ �B�;L�IL�u�RS�%��`���D7۰�8G��ʔ��P94(�2�-��7F�е��(�(S`�� ������$1�"+����"E�(�͘>��J��g��=�Ѧ�9kj�Y���hAB�@����xi�����ͪ{��^�Z���V��T���m�
�@�9�?aN�\�v*@r�K�d$6i{�PL�>#ț}�z�ҀрCyO��lfiq^[F�:i?�V6��*  �L�P@K��h�VF�Ye���&�p�������b�>�RfU��N?�L?��fHH��^�0�7G��I�p`��"���x    ���6���f/hz�f&{���If���Tc3:s�6��P�d�@�H\D{Q��<��\��H����������<��?a{�� �����F�@��JIEND�B`�

Thanks in advance for your help!!

Body:
I only tested this with video, but it should work with images

     <input type="file" name="file" class="file"id="files"onchange="changefile()"/>

<video style="display: none;" id="vid"src="" width="350px" controls />

    document.querySelector("input[type=file]")
.onchange = function(event) {
  let file = event.target.files[0];
  let blobURL = URL.createObjectURL(file);
  document.querySelector("img").style.display = "block";
  document.querySelector("img").src = blobURL;

}


来源: stackexchange

问:
Set versionCode to current date
I have some simple android application for internal use of the company. I would like to create a simple version tracking.
So to implement it I added some code to my build.gradle file:

```<code>apply plugin: 'com.android.application'
   buildscript {
      repositories {
         jcenter()
         maven {
           url "https://plugins.gradle.org/m2/"
         }
    }
    dependencies {
       classpath "com.github.ben-manes:gradle-versions-plugin:0.12.0"
       classpath 'org.moallemi.gradle.advanced-build-version:gradle-pugin:1.5.3'
   }
apply plugin: 'org.moallemi.advanced-build-version'
apply plugin: "com.github.ben-manes.versions"

advancedVersioning {
   outputOptions {
      renameOutput true
      nameFormat '${projectName}-${versionCode}'
   }
}
</code>```

All I want to do is to set versionCode to current date (long).
How can I do it? And Is it a correct direction?

Thanks in advance!

答:
There is a powerful gradle plugin on github called gradle-advanced-build-version it is very simple and
will let you auto generate version-code based on current datetime

After installing the plugin you can use the below code to automatically assign versioncode to current date:

```<code>    defaultConfig {
      advancedVersioning {
            nameOptions {
                versionMajor 4
                versionMinor 5
                versionPatch 6
                versionBuild 7
            }
            codeOptions {
                versionCodeType VersionCodeType.DATE
            }
        }
        versionName advancedVersioning.versionName
        versionCode advancedVersioning.versionCode
    }
</code>```

ContentLicense: CC BY-SA 3.0

Title: Set versionCode to current date

Body:
I have some simple android application for internal use of the company. I would like to create a simple version tracking.
So to implement it I added some code to my build.gradle file:

apply plugin: 'com.android.application'
   buildscript {
      repositories {
         jcenter()
         maven {
           url "https://plugins.gradle.org/m2/"
         }
    }
    dependencies {
       classpath "com.github.ben-manes:gradle-versions-plugin:0.12.0"
       classpath 'org.moallemi.gradle.advanced-build-version:gradle-pugin:1.5.3'
   }
apply plugin: 'org.moallemi.advanced-build-version'
apply plugin: "com.github.ben-manes.versions"

advancedVersioning {
   outputOptions {
      renameOutput true
      nameFormat '${projectName}-${versionCode}'
   }
}

All I want to do is to set versionCode to current date (long).
How can I do it? And Is it a correct direction?

Thanks in advance!

Body:
There is a powerful gradle plugin on github called gradle-advanced-build-version it is very simple and
will let you auto generate version-code based on current datetime

After installing the plugin you can use the below code to automatically assign versioncode to current date:

    defaultConfig {
      advancedVersioning {
            nameOptions {
                versionMajor 4
                versionMinor 5
                versionPatch 6
                versionBuild 7
            }
            codeOptions {
                versionCodeType VersionCodeType.DATE
            }
        }
        versionName advancedVersioning.versionName
        versionCode advancedVersioning.versionCode
    }

ContentLicense: CC BY-SA 4.0


问:
How to pass a hash in double
There is a scenario where I have multiple keys with the same value so to avoid that repetition I have done something like below

```<code>sports = [:cricket,:football,:basketball,:baseball,:rugby,:swimming,:table_tennis,:soccer,:karate]

final_hash = Hash.new

sports.each{|d| final_hash[d] = OpenStruct.new(categories: [], count: [], user_hash: {}, sport_count: [],  options: {}, period: "",stat_type: "" )  }
</code>```

Now I want to pass this hash in my double block but Whenever I do so I get an error

```<code>context 'For users details Page' do
  it 'should give the data' do
    ###now I want to pass the hash SO can anyone guide me how can I do it
    presenter =  double(UserPresenter, id: 1, sector_name: nil, final_hash)
  end
end
</code>```

答: As suggested by @engineersmnky making use of double splat operator(**hash) on hash worked for me.</p>

Title: How to pass a hash in double

Body:
There is a scenario where I have multiple keys with the same value so to avoid that repetition I have done something like below

sports = [:cricket,:football,:basketball,:baseball,:rugby,:swimming,:table_tennis,:soccer,:karate]

final_hash = Hash.new

sports.each{|d| final_hash[d] = OpenStruct.new(categories: [], count: [], user_hash: {}, sport_count: [],  options: {}, period: "",stat_type: "" )  }

Now I want to pass this hash in my double block but Whenever I do so I get an error

context 'For users details Page' do
  it 'should give the data' do
    ###now I want to pass the hash SO can anyone guide me how can I do it
    presenter =  double(UserPresenter, id: 1, sector_name: nil, final_hash)
  end
end


问:
C++ Matrix Class - Suggestions
I am trying to build a templated Matrix class in C++. Below is its implementation.
I implemented two operators +,+= as of now just to give an idea on how it will look and I thought it would be best to ask for feedback before I proceed any further.

The whole implementation is public and also there are no explicit bound/error checks, this is because its not meant to be a full fledged matrix library and hence avoided unnecessary code.

It would be very helpful if someone could comment on it and may be suggest a few improvements or suggestions.

Thank you.

```<code>template<class T>
class Matrix
{
    public:
    int r,c;
    vector< vector< T > >mat;

    Matrix() {}

    // Constructor to set the size of the matrix
    Matrix(int _r,int _c)
    {
        r=_r;c=_c;
        mat.resize(r);
        for(int i=0;i<r;i++)
            mat[i].resize(c);
    }
    // Constructor to build a matrix from a C 2d array
    // Pointer to the first element is passed (&arr[0][0])
    Matrix(T *arr,int _r,int _c)
    {
        r=_r;c=_c;
        mat.resize(r);
        for(int i=0;i<r;i++)
            for(int j=0;j<c;j++)
                mat[i].push_back(arr[i*c+j]);
    }
    template<typename U>
    Matrix<T>& operator +=(const Matrix<U>&M)
    {
        for(int i=0;i<r;i++)
            for(int j=0;j<c;j++)
                mat[i][j]+=static_cast<T>(M.mat[i][j]);
        return *this;
    }
    template<typename U>
    Matrix<T> operator +(const Matrix<U>&M)
    {
        Matrix<T>tmp=*this;
        return tmp+=M;
    }
};

template<typename T>
istream& operator >>(istream &in,Matrix<T>&M)
{
    in>>M.r>>M.c;
    Matrix<T>tmp(M.r,M.c);
    for(int i=0;i<M.r;i++)
        for(int j=0;j<M.c;j++)
            in>>tmp.mat[i][j];
    M=tmp;
    return in;
}
template<typename T>
ostream& operator <<(ostream &out,Matrix<T>M)
{
    for(int i=0;i<M.r;i++)
    {
        for(int j=0;j<M.c;j++)
            cout<<M.mat[i][j]<<" ";
        cout<<endl;
    }
    return out;
}
</code>```

EDIT:
Thank you all for the suggestions.

I just have one small question, say I do want to implement error checking (ex: checking for bounds,valid arguments etc..) however I do want the provide user with an option to disable error checking completely, is there any good way to implement this ?
What I need is something like example:`ios_base::sync_with_stdio(0);.
Thanks again.

答:
A couple of points:

Use a single std::vector<T> instead of std::vector<std::vector<T>>. Index it with y*r+x - use and operator overload to make this easier (see next point). This will be more memory efficient and slightly faster (and your init will be a lot easier: resize(r*c)).

Make your data members private to protect your matrix against unintentional size changes. For example, user code can currently resize the vectors but leave the old r and c.

Overload operator() to access the matrix (both const and non-const). If you really must use the matrix[r][c] syntax instead of matrix(r,c), consider overloading operator[] and returning an iterator to the correct row (vector iterators are random access, so they will provide operator[]).

Implement operator+ as a non-friend non-member function instead - Improves encapsulation!

Use initialization lists as others suggested.

Let the constructor that currently takes a T* take an iterator instead. That way you automagically get the pointers support along with a lot of other cool things, such as range checking for debug-iterators, automatic type conversion for compatible value types and support for all other random access iterators. Also consider filling your matrix row-wise, so you can use forward iterators too.

Title: C++ Matrix Class - Suggestions

Body:
I am trying to build a templated Matrix class in C++. Below is its implementation.
I implemented two operators +,+= as of now just to give an idea on how it will look and I thought it would be best to ask for feedback before I proceed any further.

The whole implementation is public and also there are no explicit bound/error checks, this is because its not meant to be a full fledged matrix library and hence avoided unnecessary code.

It would be very helpful if someone could comment on it and may be suggest a few improvements or suggestions.

Thank you.

template<class T>
class Matrix
{
    public:
    int r,c;
    vector< vector< T > >mat;

    Matrix() {}

    // Constructor to set the size of the matrix
    Matrix(int _r,int _c)
    {
        r=_r;c=_c;
        mat.resize(r);
        for(int i=0;i<r;i++)
            mat[i].resize(c);
    }
    // Constructor to build a matrix from a C 2d array
    // Pointer to the first element is passed (&arr[0][0])
    Matrix(T *arr,int _r,int _c)
    {
        r=_r;c=_c;
        mat.resize(r);
        for(int i=0;i<r;i++)
            for(int j=0;j<c;j++)
                mat[i].push_back(arr[i*c+j]);
    }
    template<typename U>
    Matrix<T>& operator +=(const Matrix&M)
    {
        for(int i=0;i<r;i++)
            for(int j=0;j<c;j++)
                mat[i][j]+=static_cast<T>(M.mat[i][j]);
        return *this;
    }
    template<typename U>
    Matrix<T> operator +(const Matrix&M)
    {
        Matrix<T>tmp=*this;
        return tmp+=M;
    }
};

template<typename T>
istream& operator >>(istream &in,Matrix<T>&M)
{
    in>>M.r>>M.c;
    Matrix<T>tmp(M.r,M.c);
    for(int i=0;i<M.r;i++)
        for(int j=0;j<M.c;j++)
            in>>tmp.mat[i][j];
    M=tmp;
    return in;
}
template<typename T>
ostream& operator <<(ostream &out,Matrix<T>M)
{
    for(int i=0;i<M.r;i++)
    {
        for(int j=0;j<M.c;j++)
            cout<<M.mat[i][j]<<" ";
        cout<<endl;
    }
    return out;
}

EDIT:
Thank you all for the suggestions.

I just have one small question, say I do want to implement error checking (ex: checking for bounds,valid arguments etc..) however I do want the provide user with an option to disable error checking completely, is there any good way to implement this ?
What I need is something like example:`ios_base::sync_with_stdio(0);.
Thanks again.


问:
CMake append objects from different CMakeLists.txt into one library
I would like to create a single library from objects from multiple sub-directories, each one containing their own CMakeLists.txt with OBJECT library trick to have multiple targets with different compile options.

Here are the files:

```<code>project_dir
|--- subdir1
|    |--- src1.c
|    |--- CMakeLists.txt
|--- subdir2
|    |--- src2.c
|    |--- CMakeLists.txt
|--- CMakeLists.txt
</code>```

Contents of all CMakeLists.txt

```<code>// project_dir/CMakeLists.txt
// what to put here? to make one single library (mainLib)

// project_dir/subdir1/CMakeLists.txt
add_library(lib11 OBJECT src1.c)
set_target_properties(lib11 PROPERTIES COMPILE_FLAGS "some-flags11")

add_library(lib12 OBJECT src1.c)
set_target_properties(lib12 PROPERTIES COMPILE_FLAGS "some-flags12")
// here I would like to add lib11:objects and lib12:objects to mainLib
// how should it be done?

// project_dir/subdir2/CMakeLists.txt
// *** similar to subdir1 but with src2.c that creates lib21 and lib22
// here I would like to add lib21:objects and lib22:objects to mainLib
// how should it be done?
</code>```

Can it be done platform independently? Thanks.

EDIT:
Based on CMake: how create a single shared library from all static libraries of subprojects?, I can change the cmake files to the following, but still doesn't solve my problem.

```<code>// project_dir/subdir1/CMakeLists.txt
add_library(lib11 OBJECT src1.c)
set_target_properties(lib11 PROPERTIES COMPILE_FLAGS "some-flags11")

add_library(lib12 OBJECT src1.c)
set_target_properties(lib12 PROPERTIES COMPILE_FLAGS "some-flags12")

add_library(lib1 STATIC $<TARGET_OBJECTS:lib11> $<TARGET_OBJECTS:lib12>)

// Above add_library cannot be OBJECT which would fix my problem.
// how to append the lib1 (lib11 and lib12) to mainLib?
</code>```

EDIT:
Updating my post with attempt to chain interface libraries as suggested in the answer.

```<code>add_library(lib11 OBJECT test1/sub1/src1.c)
set_target_properties(lib11 PROPERTIES COMPILE_FLAGS "-DF1")

add_library(lib12 OBJECT test1/sub1/src1.c)
set_target_properties(lib12 PROPERTIES COMPILE_FLAGS "-DF2")

add_library(lib1 INTERFACE)
target_sources(lib1 INTERFACE $<TARGET_OBJECTS:lib11>)
target_sources(lib1 INTERFACE $<TARGET_OBJECTS:lib12>)

add_library(lib21 OBJECT test1/sub2/src2.c)
set_target_properties(lib21 PROPERTIES COMPILE_FLAGS "-DF1")

add_library(lib22 OBJECT test1/sub2/src2.c)
set_target_properties(lib22 PROPERTIES COMPILE_FLAGS "-DF2")

add_library(lib2 INTERFACE)
target_sources(lib2 INTERFACE $<TARGET_OBJECTS:lib21>)
target_sources(lib2 INTERFACE $<TARGET_OBJECTS:lib22>)

add_library(PARENT INTERFACE)

target_link_libraries(PARENT INTERFACE lib1)
target_link_libraries(PARENT INTERFACE lib2)

add_library(CORE OBJECT src.c)
add_library(GPARENT STATIC $<TARGET_OBJECTS:CORE>)

target_link_libraries(GPARENT INTERFACE PARENT)
</code>```

答:
I just collect objects from all places using set with PARENT_SCOPE.

root CMakeLists.txt:

```<code>set(OBJECTS)

add_subdirectory(lib1)
add_subdirectory(lib2)

add_library(lib STATIC ${OBJECTS})
</code>```

CMakeLists.txt in subdirectories:

```<code>add_subdirectory(lib11)

add_library(${PROJECT_NAME} OBJECT src1.c)
list(APPEND OBJECTS $<TARGET_OBJECTS:${PROJECT_NAME}>)
set(OBJECTS ${OBJECTS} PARENT_SCOPE)
</code>```

Body:
I would like to create a single library from objects from multiple sub-directories, each one containing their own CMakeLists.txt with OBJECT library trick to have multiple targets with different compile options.

Here are the files:

project_dir
|--- subdir1
|    |--- src1.c
|    |--- CMakeLists.txt
|--- subdir2
|    |--- src2.c
|    |--- CMakeLists.txt
|--- CMakeLists.txt

Contents of all CMakeLists.txt

// project_dir/CMakeLists.txt
// what to put here? to make one single library (mainLib)

// project_dir/subdir1/CMakeLists.txt
add_library(lib11 OBJECT src1.c)
set_target_properties(lib11 PROPERTIES COMPILE_FLAGS "some-flags11")

add_library(lib12 OBJECT src1.c)
set_target_properties(lib12 PROPERTIES COMPILE_FLAGS "some-flags12")
// here I would like to add lib11:objects and lib12:objects to mainLib
// how should it be done?

// project_dir/subdir2/CMakeLists.txt
// *** similar to subdir1 but with src2.c that creates lib21 and lib22
// here I would like to add lib21:objects and lib22:objects to mainLib
// how should it be done?

Can it be done platform independently? Thanks.

EDIT:
Based on CMake: how create a single shared library from all static libraries of subprojects?, I can change the cmake files to the following, but still doesn't solve my problem.

// project_dir/subdir1/CMakeLists.txt
add_library(lib11 OBJECT src1.c)
set_target_properties(lib11 PROPERTIES COMPILE_FLAGS "some-flags11")

add_library(lib12 OBJECT src1.c)
set_target_properties(lib12 PROPERTIES COMPILE_FLAGS "some-flags12")

add_library(lib1 STATIC $<TARGET_OBJECTS:lib11> $<TARGET_OBJECTS:lib12>)

// Above add_library cannot be OBJECT which would fix my problem.
// how to append the lib1 (lib11 and lib12) to mainLib?

EDIT:
Updating my post with attempt to chain interface libraries as suggested in the answer.

add_library(lib11 OBJECT test1/sub1/src1.c)
set_target_properties(lib11 PROPERTIES COMPILE_FLAGS "-DF1")

add_library(lib12 OBJECT test1/sub1/src1.c)
set_target_properties(lib12 PROPERTIES COMPILE_FLAGS "-DF2")

add_library(lib1 INTERFACE)
target_sources(lib1 INTERFACE $<TARGET_OBJECTS:lib11>)
target_sources(lib1 INTERFACE $<TARGET_OBJECTS:lib12>)

add_library(lib21 OBJECT test1/sub2/src2.c)
set_target_properties(lib21 PROPERTIES COMPILE_FLAGS "-DF1")

add_library(lib22 OBJECT test1/sub2/src2.c)
set_target_properties(lib22 PROPERTIES COMPILE_FLAGS "-DF2")

add_library(lib2 INTERFACE)
target_sources(lib2 INTERFACE $<TARGET_OBJECTS:lib21>)
target_sources(lib2 INTERFACE $<TARGET_OBJECTS:lib22>)

add_library(PARENT INTERFACE)

target_link_libraries(PARENT INTERFACE lib1)
target_link_libraries(PARENT INTERFACE lib2)

add_library(CORE OBJECT src.c)
add_library(GPARENT STATIC $<TARGET_OBJECTS:CORE>)

target_link_libraries(GPARENT INTERFACE PARENT)

Body:
I just collect objects from all places using set with PARENT_SCOPE.

root CMakeLists.txt:

set(OBJECTS)

add_subdirectory(lib1)
add_subdirectory(lib2)

add_library(lib STATIC ${OBJECTS})

CMakeLists.txt in subdirectories:

add_subdirectory(lib11)

add_library(${PROJECT_NAME} OBJECT src1.c)
list(APPEND OBJECTS $<TARGET_OBJECTS:${PROJECT_NAME}>)
set(OBJECTS ${OBJECTS} PARENT_SCOPE)


问:
How is it decided that how much physical memory is to be allocated to java heap?
I have machine with 16G RAM. I run a java application with arguments -Xms9G -Xmx9G.
When I run top command I see that my java process is taking 13.8g VIRT, but only 4.6g of RES.

```<code>  PID USER      PR  NI  VIRT  RES  SHR S %CPU %MEM    TIME+  COMMAND
 5019 root      20   0 13.8g 4.7g  18m S  0.7 30.7   3:28.39 java
</code>```

On running pmap command, I see that only ~3.9g of heap is present as RES, rest 5.7g is in virtual.

```<code>Address           Kbytes     RSS   Dirty Mode   Mapping
0000000580000000 9452384 4074228 4074228 rw---    [ anon ]
</code>```

Upon monitoring HPCUR with jvmtop, I observe that the GC is triggered when the HPCUR reaches about 3g.

```<code>PID MAIN-CLASS        HPCUR HPMAX NHCUR NHMAX    CPU     GC    VM USERNAME   #T DL
 5019 .1-SNAPSHOT.jar  408m 9216m  192m   n/a  0.25%  0.00% O8U20   webapp  823
</code>```

I observe that the RES for the process increases gradually, heap memory in RES (by pmap) also increases gradually too. As a result GC threshold increases.

I have several questions about this behavior.

Is only the heap that is present in RES used, and not the VIRT?

If I have allotted 9G min heap (-Xms), then initially why only 3.9g RES is allotted. Isn't this same as keeping -Xms low? What is the point of keeping -Xms=-Xmx then?

On what basis is it decided that how much heap should be in RES? Read somewhere that its managed by OS, but any rough logic?

Any way to make sure, that the allotted heap is actually used?

答:
Yes HEAP is RES (as long as it fits in main memory)

This answer suggests that -Xms is a hint to GC at what point a full garbage collection is necessary. Testing with my local JVM I can confirm that it does not immediately reserve the memory. What you gain is that your JVM does not block a lot of unused memory but will reach you lower bound faster as there are less GC runs.

Answered by 1. : RES always contains all of HEAP

My understanding is that your options will achieve what you intend to. Your application will grab 9GB of memory and then start garbage collection more frequently. There are other options like MinHeapFreeRatio and options that depend on the gargbage collector used if you need more optimization.

Did you print GC logs and verify that something is wrong? If you see a lot of GC runs on application startup before 9G is reached I would look further. If there is hardly any GC run before hitting 9G I would say everything is fine.

Body:
I have machine with 16G RAM. I run a java application with arguments -Xms9G -Xmx9G.
When I run top command I see that my java process is taking 13.8g VIRT, but only 4.6g of RES.

  PID USER      PR  NI  VIRT  RES  SHR S %CPU %MEM    TIME+  COMMAND
 5019 root      20   0 13.8g 4.7g  18m S  0.7 30.7   3:28.39 java

On running pmap command, I see that only ~3.9g of heap is present as RES, rest 5.7g is in virtual.

Address           Kbytes     RSS   Dirty Mode   Mapping
0000000580000000 9452384 4074228 4074228 rw---    [ anon ]

Upon monitoring HPCUR with jvmtop, I observe that the GC is triggered when the HPCUR reaches about 3g.

PID MAIN-CLASS        HPCUR HPMAX NHCUR NHMAX    CPU     GC    VM USERNAME   #T DL
 5019 .1-SNAPSHOT.jar  408m 9216m  192m   n/a  0.25%  0.00% O8U20   webapp  823

I observe that the RES for the process increases gradually, heap memory in RES (by pmap) also increases gradually too. As a result GC threshold increases.

I have several questions about this behavior.

Is only the heap that is present in RES used, and not the VIRT?

If I have allotted 9G min heap (-Xms), then initially why only 3.9g RES is allotted. Isn't this same as keeping -Xms low? What is the point of keeping -Xms=-Xmx then?

On what basis is it decided that how much heap should be in RES? Read somewhere that its managed by OS, but any rough logic?

Any way to make sure, that the allotted heap is actually used?


问:
ckeditor character count on multiple textareas with wordcount plugin
I have multiple ckeditor textareas on single page, and I need to limit character count for all of them combined.
Is it possible to do it with ckeditor, or is it possible to get that value to javascript variable so I can add them and create alert that way?</p>

答:
If you know the ID of each CKEditor instances then you can use the getData method or you can use CKEDITOR.instances to get all instances on a page and have logic in place as needed.

```<code>for (var id in CKEDITOR.instances) {
     console.log(CKEDITOR.instances[id].getData().replace(/<[^>]*>|\s/g, '').length);
}
</code>```

Body:
If you know the ID of each CKEditor instances then you can use the getData method or you can use CKEDITOR.instances to get all instances on a page and have logic in place as needed.

for (var id in CKEDITOR.instances) {
     console.log(CKEDITOR.instances[id].getData().replace(/<[^>]*>|\s/g, '').length);
}


问:
TypeError: unhashable type: 'set' in HTTP GET Request
I am trying to execute the below python function to check the status of an invoice from an external API:

```<code>def getInvoice(inv_id):
    response = requests.get("https://api.example.com/invoices/"+str(inv_id)+"?access_token=123456789").json()
    return response

print(getInvoice("5b5f60384b3f"))
</code>```

When I try to call the function, I keep receiving the following error:

```<code> Traceback (most recent call last):
  File "C:\Users\user\Desktop\app\db.py", line 82, in <module>
    print(getInvoice("5b5f60384b3f"))
  File "C:\Users\user\Desktop\app\db.py", line 79, in getInvoice
    response = requests.get("https://api.example.com/invoices/"+str(inv_id)+"?access_token=123456789").json()
TypeError: unhashable type: 'set'
[Finished in 3.0s]
</code>```

I don't understand why this keeps happening, or where the 'set' is? Any help is much appreciated.

答:
As it was mentioned, looks like server does not reply with JSON.

Change getInvoice function and examine server response:

def getInvoice(inv_id):
    url = "https://api.example.com/invoices/{}?access_token=123456789".format(inv_id)
    response = requests.get(url)
    response.raise_for_status()  # you will get an exception if HTTP status code != 200

    try:
        return response.json()
    except:  # for debugging purposes only
        print("Failed to obtain JSON response. Response contents:\n{}".format(response.text))
        raise
```

Body:
I am trying to execute the below python function to check the status of an invoice from an external API:

def getInvoice(inv_id):
    response = requests.get("https://api.example.com/invoices/"+str(inv_id)+"?access_token=123456789").json()
    return response

print(getInvoice("5b5f60384b3f"))

When I try to call the function, I keep receiving the following error:

 Traceback (most recent call last):
  File "C:\Users\user\Desktop\app\db.py", line 82, in <module>
    print(getInvoice("5b5f60384b3f"))
  File "C:\Users\user\Desktop\app\db.py", line 79, in getInvoice
    response = requests.get("https://api.example.com/invoices/"+str(inv_id)+"?access_token=123456789").json()
TypeError: unhashable type: 'set'
[Finished in 3.0s]

I don't understand why this keeps happening, or where the 'set' is? Any help is much appreciated.


问:
Pyserial AT command questions
I want to send a simple command via pyserial but I found that when I send "" symbol in pyserial.write, it change to another format.

May I know how to send "" symbol using pyserial?

```<code>import serial
import time
import sys

class SIMComModem(object):

def __init__(self):
    self.open()

def open(self):
    self.ser = serial.Serial('COM9', 115200, timeout=5)
    print("Send AT OK command \n ")
    self.SendCommand('AT\r')
    time.sleep(0.5)

def SendCommand(self, command, getline=True):
    self.ser.flushInput()
    self.ser.flushOutput()
    print(command.encode())
    self.ser.write(command.encode())
    data = ''
    if getline:
        data = self.ReadLine()
    return data

def ReadLine(self):
    data = self.ser.readline()
    data = self.ser.readline()
    print(data)
    return data

def SetGPS(self):
    pass

def GetGpsOne(self):
    print("Set APN")
    self.SendCommand('AT+CGSOCKCONT=1,”IP”,”mobile”\r')
    time.sleep(0.5)
    print("Donwnload GpsOneData")
    self.SendCommand('AT+CGPSXD=0\r')
    time.sleep(0.5)
    self.SendCommand('AT+CHTPSERV=\\”ADD\\”,\\”www.google.com\\”,80,1\r')
    time.sleep(0.5)
    print("Update Time zone")
    self.SendCommand('AT+CTZU=1\r')
    time.sleep(0.5)
    self.SendCommand('AT+CCLK?\r')
    time.sleep(0.5)
</code>```

I expect when i call GetGpsOne function it will send out AT+CGSOCKCONT=1,"IP","mobile" to COM port , but the result is as below:

```<code>b'AT\r'
b'OK\r\n'
Set APN
b'AT+CGSOCKCONT=1,\xe2\x80\x9dIP\xe2\x80\x9d,\xe2\x80\x9dmobile\xe2\x80\x9d\r'
</code>```

答:
You'll want "straight" quotes, not the ”typographical” quotes you're currently using.

Try

print("Set APN")
self.SendCommand('AT+CGSOCKCONT=1,"IP","mobile"\r')
time.sleep(0.5)
print("Donwnload GpsOneData")
self.SendCommand('AT+CGPSXD=0\r')
time.sleep(0.5)
self.SendCommand('AT+CHTPSERV="ADD","www.google.com",80,1\r')
time.sleep(0.5)
print("Update Time zone")
self.SendCommand('AT+CTZU=1\r')
time.sleep(0.5)
self.SendCommand('AT+CCLK?\r')
time.sleep(0.5)
```

<p>instead.</p>

<p>To clarify, here's what's going wrong with your typographical quote:</p>

<pre class="lang-py prettyprint-override"><code>>>> ord('”')  # <-- the quote used by the original code
8221
>>> '”'.encode('utf-8')
b'\xe2\x80\x9d'  # <-- the UTF-8 encoding you saw

>>> ord('"')  # <-- the correct ASCII quote
34
>>> '"'.encode('utf-8')  # <-- its UTF-8 encoding
b'\x22'
</code>```

Title: Pyserial AT command questions

Body:
I want to send a simple command via pyserial but I found that when I send "" symbol in pyserial.write, it change to another format.

May I know how to send "" symbol using pyserial?

import serial
import time
import sys

class SIMComModem(object):

def __init__(self):
    self.open()

def open(self):
    self.ser = serial.Serial('COM9', 115200, timeout=5)
    print("Send AT OK command \n ")
    self.SendCommand('AT\r')
    time.sleep(0.5)

def SendCommand(self, command, getline=True):
    self.ser.flushInput()
    self.ser.flushOutput()
    print(command.encode())
    self.ser.write(command.encode())
    data = ''
    if getline:
        data = self.ReadLine()
    return data

def ReadLine(self):
    data = self.ser.readline()
    data = self.ser.readline()
    print(data)
    return data

def SetGPS(self):
    pass

def GetGpsOne(self):
    print("Set APN")
    self.SendCommand('AT+CGSOCKCONT=1,”IP”,”mobile”\r')
    time.sleep(0.5)
    print("Donwnload GpsOneData")
    self.SendCommand('AT+CGPSXD=0\r')
    time.sleep(0.5)
    self.SendCommand('AT+CHTPSERV=\\”ADD\\”,\\”www.google.com\\”,80,1\r')
    time.sleep(0.5)
    print("Update Time zone")
    self.SendCommand('AT+CTZU=1\r')
    time.sleep(0.5)
    self.SendCommand('AT+CCLK?\r')
    time.sleep(0.5)

I expect when i call GetGpsOne function it will send out AT+CGSOCKCONT=1,"IP","mobile" to COM port , but the result is as below:

b'AT\r'
b'OK\r\n'
Set APN
b'AT+CGSOCKCONT=1,\xe2\x80\x9dIP\xe2\x80\x9d,\xe2\x80\x9dmobile\xe2\x80\x9d\r'

Body:
You'll want "straight" quotes, not the ”typographical” quotes you're currently using.

Try

print("Set APN")
self.SendCommand('AT+CGSOCKCONT=1,"IP","mobile"\r')
time.sleep(0.5)
print("Donwnload GpsOneData")
self.SendCommand('AT+CGPSXD=0\r')
time.sleep(0.5)
self.SendCommand('AT+CHTPSERV="ADD","www.google.com",80,1\r')
time.sleep(0.5)
print("Update Time zone")
self.SendCommand('AT+CTZU=1\r')
time.sleep(0.5)
self.SendCommand('AT+CCLK?\r')
time.sleep(0.5)

instead.

To clarify, here's what's going wrong with your typographical quote:

>>> ord('”')  # <-- the quote used by the original code
8221
>>> '”'.encode('utf-8')
b'\xe2\x80\x9d'  # <-- the UTF-8 encoding you saw

>>> ord('"')  # <-- the correct ASCII quote
34
>>> '"'.encode('utf-8')  # <-- its UTF-8 encoding
b'\x22'


问:
HERE Maps - Is there a way to keep a marker centered in the map even when map is moved?
I haven’t been able to find documentation on it -
Is it possible to have a marker always be centered on the map - have the map be moveable but the marker always in the center of it?

Any help is greatly appreciated!

Update - here is the JS we're currently using:

```<code><script src="https://js.api.here.com/v3/3.0/mapsjs-core.js" type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.0/mapsjs-service.js" type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.0/mapsjs-ui.js" type="text/javascript" charset="utf-8"></script>
<script src="https://js.api.here.com/v3/3.0/mapsjs-mapevents.js" type="text/javascript" charset="utf-8"></script>
</code>```

答:
You can register a 'sync' event listener and then retrieve the center of the map any time the map view changes. You can then set the position of your marker to the retrieved center coordinates. See code snippet:</p>

```<code>map.getViewModel().addEventListener('sync', function() {
  var center = map.getCenter();
  // Set marker position here:
  // <marker object>.setPosition(center);
});
</code>```

Body:
You can register a 'sync' event listener and then retrieve the center of the map any time the map view changes. You can then set the position of your marker to the retrieved center coordinates. See code snippet:

map.getViewModel().addEventListener('sync', function() {
  var center = map.getCenter();
  // Set marker position here:
  // <marker object>.setPosition(center);
});


问:
find-bug error String can't cast to Util.Map
find-bug shows String can't cast to util.Map

When run through the application getting correct result.
siteList looks [{site_id=47, site_code=a}, {site_id=48, site_code=ABC}, {site_id=49, site_code=ABCD}, {site_id=54, site_code=ABCE}, {site_id=1, site_code=FXGL}]

```<code>public static List<SitesDto> transformSites(List<String> siteList) {
                List<SitesDto> sitList = new ArrayList<>();
                for (Object object : siteList) {
                    Map row = (Map) object;----->showing error
                    final SitesDto site = new SitesDto();
                    String code = (String) row.get(SITE_CODE);
                    Object id = row.get(SITE_ID);
                    site.setSiteId(((Number) id).longValue());
                    site.setSiteCode(code);
                    sitList.add(site);
                }
                return sitList;
            }
</code>```

find-bug shows String can't cast to util.Map

答: You declare a method that accepts a List<String> argument. Since you say that the application runs without any apparent error, it would appear that the siteList argument is not actually a List<String> at all, but instead is a List<Map>. You should have got a findbugs warning somewhere else, probably in the method that calls transformSites, saying that you shouldn't be using raw types or that a List<Map> shouldn't be passed to a method that takes a List<String> argument. You should fix that first. You should also avoid using raw types: use List<whatever> instead of just List, and Map<String, Number> instead of just Map. Otherwise, you are making it easier to make errors.

Body:
find-bug shows String can't cast to util.Map

When run through the application getting correct result.
siteList looks [{site_id=47, site_code=a}, {site_id=48, site_code=ABC}, {site_id=49, site_code=ABCD}, {site_id=54, site_code=ABCE}, {site_id=1, site_code=FXGL}]

public static List<SitesDto> transformSites(List<String> siteList) {
                List<SitesDto> sitList = new ArrayList<>();
                for (Object object : siteList) {
                    Map row = (Map) object;----->showing error
                    final SitesDto site = new SitesDto();
                    String code = (String) row.get(SITE_CODE);
                    Object id = row.get(SITE_ID);
                    site.setSiteId(((Number) id).longValue());
                    site.setSiteCode(code);
                    sitList.add(site);
                }
                return sitList;
            }

find-bug shows String can't cast to util.Map


问:
Android WebView gets too slow simetimes, when I turn just my STB on
I have a simple Android application which just contains a WebView to load my Web_Based application and a VideoView to play movie and Live TV.
Sometimes when I just turn my STB on, WebView loads the Web_Based application too slowly and sometimes fast.

My Web_Based application is in a local server (Ubuntu 12.04) and I can load this in my Computer Browser (Windows 10, Firefox and Chrome) fast Always. So I expect this happens in my Android Application fast Aslways.

I tried increasing the performance of WebView and also clearing Cache a lot. But it did not help at all.

```<code>// Here are some WebView settings

mWebView.clearCache(true);
mWebView.getSettings().setAppCacheEnabled(false);
mWebView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
mWebView.clearHistory();
mWebView.getSettings().setLoadsImagesAutomatically(true);
webSettings.setJavaScriptEnabled(true);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    // chromium, enable hardware acceleration
    mWebView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
    // older android version, disable hardware acceleration
    mWebView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}

</code>```

答:
It seems that you have met all the requirements. So, in the next step, you must check the network connection with a tool such as PING.

If the connection between your android stb and host (web_based server) is not good and there are a lot of time outs, so the WebView can not respond well. So make sure about that.

Body:
I have a simple Android application which just contains a WebView to load my Web_Based application and a VideoView to play movie and Live TV.
Sometimes when I just turn my STB on, WebView loads the Web_Based application too slowly and sometimes fast.

My Web_Based application is in a local server (Ubuntu 12.04) and I can load this in my Computer Browser (Windows 10, Firefox and Chrome) fast Always. So I expect this happens in my Android Application fast Aslways.

I tried increasing the performance of WebView and also clearing Cache a lot. But it did not help at all.

// Here are some WebView settings

mWebView.clearCache(true);
mWebView.getSettings().setAppCacheEnabled(false);
mWebView.getSettings().setCacheMode(WebSettings.LOAD_NO_CACHE);
mWebView.clearHistory();
mWebView.getSettings().setLoadsImagesAutomatically(true);
webSettings.setJavaScriptEnabled(true);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
    // chromium, enable hardware acceleration
    mWebView.setLayerType(View.LAYER_TYPE_HARDWARE, null);
} else {
    // older android version, disable hardware acceleration
    mWebView.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
}


问:
SQL Server Configuration Manager 'Invalid class' Error
Getting an error while trying to connect to the reporting server and when I click 'find' it returns a message Invalid class. The reporting service is also running.

答: I had a similar problem on MS SQL 2016. To solve the problem, I reinstalled MS SQL Server and chose not to configure Report Server during installation. After that, everything worked for me.</p>


问:
C# Server program is unable to detect broken link
The following are the basic skeletons of my .net server and Java client programs:

C# server skeleton

```<code>class ServerProgram
{
    static string origClientID = string.Empty;
    static string reqClientID = string.Empty;
    static string stKey = string.Empty;
    static string stValue = string.Empty;
    static Dictionary<string, KeyValue> KeyValueDictionary;
    static Dictionary<string, ClientClass> ClientDictionary;

    static void Main(string[] args)
    {
        Console.Title = "Server";
        Console.WriteLine("Server program started on address [" + Constants.SERVER_IP +":"+Constants.PORT_NO+"]");

        KeyValueDictionary = new Dictionary<string, KeyValue>();
        ClientDictionary = new Dictionary<string, ClientClass>();

        string ipAddress = Constants.SERVER_IP;
        int portNo = Constants.PORT_NO;

        IPAddress ip = IPAddress.Parse(ipAddress);
        TcpListener listener = new TcpListener(ip, portNo);

        // poll for clients in a 2nd thread
        Thread thread = new Thread(delegate()
        {
            ServerProgram.PollIncomingClientConns(listener);
        });

        thread.Start();
    }

    #region catching client connections
    static void PollIncomingClientConns(TcpListener listener)
    {
        listener.Start();

        try
        {
            bool keepRunning = true;

            while (keepRunning)
            {
                ClientClass client = new ClientClass(listener);

                ClientDictionary.Add(client.ID, client);

                Thread thread = new Thread(delegate()
                {
                    ServerProgram.ReadFromClient(client);
                });
                thread.Start();
            }
        }
        catch (Exception ex)
        {
            var inner = ex.InnerException as SocketException;
            if (inner != null && inner.SocketErrorCode == SocketError.ConnectionReset)
                Console.WriteLine("Disconnected");
            else
                Console.WriteLine(ex.Message);

            listener.Stop();
        }
    }
    #endregion

    static void ReadFromClient(ClientClass client)
    {
       try
        {
            while (client.Tcp.Connected)
            {
                string str = client.Read();
                Console.WriteLine("[" + client.ID + "] says: " + str);

                switch(str)
                {
                    case Commands.AddKeyValue:
                        //...
                        break;

                    case Commands.ListKeys:
                        //...
                        break;

                    case Commands.UpdateValue:
                        //...
                        break;

                    case Commands.Yes:
                        //...
                        break;
                }
            }
        }
        catch
        {
            client.Disconnect();
        }
    }
}
</code>```

Java Client skeleton

```<code>public class FirstJavaClientProgramTest
{
    final static String LOCAL_HOST = "127.0.0.1";
    final static int PORT_NO = 4321;

    public static void main(String args[]) throws UnknownHostException, IOException
    {
        try
        {
            Consolas.WriteLine("Hit enter twice to connect to localhost...\n");

            Consolas.WriteLine("Enter server IP : ");
            String ip = Consolas.ReadLine();

            Consolas.WriteLine("Enter server port : ");
            String portStr = Consolas.ReadLine();

            int port = -99;
            if(ip.equals("\n") || ip.equals(""))
            {
                ip = LOCAL_HOST;
            }

            if(!ip.equals("\n") || !ip.equals(""))
            {
                port = PORT_NO;
            }
            else
            {
                port = Integer.parseInt(portStr);
            }

            // establish the connection
            Socket socket = new Socket(ip, port);

            //send the client ID
            String ID = AlphaNumRandom.randomString(5);
            Consolas.WriteLine(ID);

            BinaryWriter writer = new BinaryWriter(socket);
            writer.Write(ID);

            ReaderRunnableClass readRunnable = new ReaderRunnableClass(socket);
            Thread readThread = new Thread(readRunnable);
            readThread.start();

            WriterRunnableClass writeRunnable = new WriterRunnableClass(socket);
            Thread writeThread = new Thread(writeRunnable);
            writeThread.start();
        }
        catch(Exception ex)
        {
            Consolas.WriteLine("Failed to connect to the server!");
            //Consoles.WriteLine(ex.getMessage());
        }
    }//:~ main
}//:~ class
</code>```

There is a problem with the server program.

The server program can detect a disconnected client if a client is explicitly closed by the user.

But, the server program cannot explicitly detect

if the client is crashed, and/or

if the network link is failed during the communication

How can I detect that?

答: You should periodically send keep-alive messages to all connected clients. Check this article Detection of Half-Open (Dropped) Connections. I actually recommend you to read entire series TCP/IP .NET Sockets FAQ. Here you can check example of C# implementation in KeepAlive method.

Body:
The following are the basic skeletons of my .net server and Java client programs:

C# server skeleton

class ServerProgram
{
    static string origClientID = string.Empty;
    static string reqClientID = string.Empty;
    static string stKey = string.Empty;
    static string stValue = string.Empty;
    static Dictionary<string, KeyValue> KeyValueDictionary;
    static Dictionary<string, ClientClass> ClientDictionary;

    static void Main(string[] args)
    {
        Console.Title = "Server";
        Console.WriteLine("Server program started on address [" + Constants.SERVER_IP +":"+Constants.PORT_NO+"]");

        KeyValueDictionary = new Dictionary<string, KeyValue>();
        ClientDictionary = new Dictionary<string, ClientClass>();

        string ipAddress = Constants.SERVER_IP;
        int portNo = Constants.PORT_NO;

        IPAddress ip = IPAddress.Parse(ipAddress);
        TcpListener listener = new TcpListener(ip, portNo);

        // poll for clients in a 2nd thread
        Thread thread = new Thread(delegate()
        {
            ServerProgram.PollIncomingClientConns(listener);
        });

        thread.Start();
    }

    #region catching client connections
    static void PollIncomingClientConns(TcpListener listener)
    {
        listener.Start();

        try
        {
            bool keepRunning = true;

            while (keepRunning)
            {
                ClientClass client = new ClientClass(listener);

                ClientDictionary.Add(client.ID, client);

                Thread thread = new Thread(delegate()
                {
                    ServerProgram.ReadFromClient(client);
                });
                thread.Start();
            }
        }
        catch (Exception ex)
        {
            var inner = ex.InnerException as SocketException;
            if (inner != null && inner.SocketErrorCode == SocketError.ConnectionReset)
                Console.WriteLine("Disconnected");
            else
                Console.WriteLine(ex.Message);

            listener.Stop();
        }
    }
    #endregion

    static void ReadFromClient(ClientClass client)
    {
       try
        {
            while (client.Tcp.Connected)
            {
                string str = client.Read();
                Console.WriteLine("[" + client.ID + "] says: " + str);

                switch(str)
                {
                    case Commands.AddKeyValue:
                        //...
                        break;

                    case Commands.ListKeys:
                        //...
                        break;

                    case Commands.UpdateValue:
                        //...
                        break;

                    case Commands.Yes:
                        //...
                        break;
                }
            }
        }
        catch
        {
            client.Disconnect();
        }
    }
}

Java Client skeleton

public class FirstJavaClientProgramTest
{
    final static String LOCAL_HOST = "127.0.0.1";
    final static int PORT_NO = 4321;

    public static void main(String args[]) throws UnknownHostException, IOException
    {
        try
        {
            Consolas.WriteLine("Hit enter twice to connect to localhost...\n");

            Consolas.WriteLine("Enter server IP : ");
            String ip = Consolas.ReadLine();

            Consolas.WriteLine("Enter server port : ");
            String portStr = Consolas.ReadLine();

            int port = -99;
            if(ip.equals("\n") || ip.equals(""))
            {
                ip = LOCAL_HOST;
            }

            if(!ip.equals("\n") || !ip.equals(""))
            {
                port = PORT_NO;
            }
            else
            {
                port = Integer.parseInt(portStr);
            }

            // establish the connection
            Socket socket = new Socket(ip, port);

            //send the client ID
            String ID = AlphaNumRandom.randomString(5);
            Consolas.WriteLine(ID);

            BinaryWriter writer = new BinaryWriter(socket);
            writer.Write(ID);

            ReaderRunnableClass readRunnable = new ReaderRunnableClass(socket);
            Thread readThread = new Thread(readRunnable);
            readThread.start();

            WriterRunnableClass writeRunnable = new WriterRunnableClass(socket);
            Thread writeThread = new Thread(writeRunnable);
            writeThread.start();
        }
        catch(Exception ex)
        {
            Consolas.WriteLine("Failed to connect to the server!");
            //Consoles.WriteLine(ex.getMessage());
        }
    }//:~ main
}//:~ class

There is a problem with the server program.

The server program can detect a disconnected client if a client is explicitly closed by the user.

But, the server program cannot explicitly detect

if the client is crashed, and/or

if the network link is failed during the communication

How can I detect that?


问:
This iPhone 7 (Model 1660, 1778, 1779, 1780) is running iOS 12.3.1 (16F203), which may not be supported by this version of Xcode
I getting the following error when I run the app into device.

This iPhone 7 (Model 1660, 1778, 1779, 1780) is running iOS 12.3.1 (16F203), which may not be supported by this version of Xcode.

my Xcode is 10.1

答: You should update your XCode to support all listed devices.</p>


问:
Display badge on top of bottom navigation bar's icon
I have implemented the bottom navigation view in my app and I have looked every where to display badges on top of the icons like this
I was wondering whether this is even possible to implement. Any help is appreciated.
Thank you.</p>

答:
Adding badges is natively supported now, using the latest material dependency
add this to your build.gradle

```<code>    implementation 'com.google.android.material:material:1.1.0-alpha09'
</code>```

in your layout add this

```<code><!-- The rest of your layout here ....-->

  <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:menu="@menu/bottom_nav_menu"
            />
</code>```

then you can just

```<code>     val navBar  = findViewById<BottomNavigationView>(R.id.bottom_navigation)
     navBar.getOrCreateBadge(R.id.action_add).number = 2
</code>```

R.id.action_add for you would be the id of the menu item you want to put a badge on. Check it from the menu file you feed to the BottomNavigationView.

Make sure your app theme is in Theme.MaterialComponents

you can check it in styles or manifest.
for this example mine was this

```<code>     <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:statusBarColor" tools:targetApi="lollipop">@color/colorPrimary</item>
    </style>
</code>```

Body:
Adding badges is natively supported now, using the latest material dependency
add this to your build.gradle

    implementation 'com.google.android.material:material:1.1.0-alpha09'

in your layout add this

<!-- The rest of your layout here ....-->

  <com.google.android.material.bottomnavigation.BottomNavigationView
            android:id="@+id/bottom_navigation"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            app:menu="@menu/bottom_nav_menu"
            />

then you can just

     val navBar  = findViewById<BottomNavigationView>(R.id.bottom_navigation)
     navBar.getOrCreateBadge(R.id.action_add).number = 2

R.id.action_add for you would be the id of the menu item you want to put a badge on. Check it from the menu file you feed to the BottomNavigationView.

Make sure your app theme is in Theme.MaterialComponents

you can check it in styles or manifest.
for this example mine was this

     <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
        <!-- Customize your theme here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>
        <item name="android:statusBarColor" tools:targetApi="lollipop">@color/colorPrimary</item>
    </style>


问:
Forget which client certificate is used by Chrome for an URL
I'm using a client certificate to authenticate with HTTPS to a website.
The first time, chrome asked me which certificate I wanted to use.
However, I don't how to flush/forget this choice to choose another certificate. Chrome remembers it and I didn't find (either in stackoverflow or chrome settings) a solution to that.

The only way I found is to open a new window in private mode.

Anyone know how to do it ?

答: This particular thing has sucked since the beginning of web browsers. The only solution is to use the platform APIs to build extension to manage client certificates. This is in fact what Google recommends but it's mainly for CAs and other solution providers. So the only way is to reload the browser or use incognito windows.</p>


问:
Override ion-content's background color
We set ion-content's background color in app.scss or wherever. How can I override it? When I put this into the page's scss:

```<code>#page-content {
    background-color: purple;
}
</code>```

Nothing happens. (Of course I added the id to the tag: <ion-content padding id="page-content">)

答:
In your Global scss or local scss mention this

ion-content{
      --background:white }

Title: Override ion-content's background color

Body:
We set ion-content's background color in app.scss or wherever. How can I override it? When I put this into the page's scss:

#page-content {
    background-color: purple;
}

Nothing happens. (Of course I added the id to the tag: <ion-content padding id="page-content">)


问:
How to enable acl in consul?
I am trying to integrate Vault with consul and following this url but its failing with the following error

Failed to create new token: Unexpected response code: 401 (ACL support
  disabled)

I am trying to run this command

```<code>CONSUL_HTTP_TOKEN=242323-43434-6809-387b-a88a25bd3d9b ./consul acl token create -policy-name=global-management
</code>```

What is the way to enable ACL in consul?

config.json file have following details

```<code>"primary_datacenter": "dc1",
  "acl": {
    "enabled": true,
    "default_policy": "deny",
    "down_policy": "extend-cache"
    }
  }
</code>```

答: config.json looks OK, but you will have to boostrap Consul ACL system first. This is described in the guide on how to setup Consul ACL system: https://learn.hashicorp.com/consul/security-networking/production-acls#create-the-initial-bootstrap-token

Title: How to enable acl in consul?

Body:
I am trying to integrate Vault with consul and following this url but its failing with the following error

Failed to create new token: Unexpected response code: 401 (ACL support
  disabled)

I am trying to run this command

CONSUL_HTTP_TOKEN=242323-43434-6809-387b-a88a25bd3d9b ./consul acl token create -policy-name=global-management

What is the way to enable ACL in consul?

config.json file have following details

"primary_datacenter": "dc1",
  "acl": {
    "enabled": true,
    "default_policy": "deny",
    "down_policy": "extend-cache"
    }
  }


问:
How to redirect a user to my application using App Url
I want my users to be redirected to a particular screen of my app when they clicked on an app URL which I sent through the message to them.</p>

答:
For that, you need to use deep linking. Please take a look of the document provided by the Google developer site.

https://developer.android.com/training/app-links/deep-linking


问:
Spring boot with Jersey - Filter request body properties
I would like to know if there is some way to filter the properties of an object that a resource receives.

Let me explain myself: lets say we have this object:

UserDTO

```<code>public final class IniciativaDocument {
    private String id;
    private String name;
    private String surname;
    private String address;
    private Double balance;
}
</code>```

And for a resource I only need the properties "name" and "surname" but for other I only need "address" and "id". Is there any way to make the unneeded variables null automatically with something like Jackson?

My goal for this is that if the client sends a request with a field that isn't needed that I don't have to make it null before saving it to the database because that field is not supposed to be initialized when registering.

Thanks.

EDIT 1

For more clarity: this is for a matter of security and easiness.

Imagine I am a hacker and somehow know the fields a DTO class has. I could easily send a POST request like this to a service which is to register users:

```<code>{
   "id": "wrong",
   "name": "Wrong",
   "balance": 20000
}
</code>```

For my service I would only need id and name but the hacker is sending a balance field too.

What I want to do is that as I receive this object, I can set my endpoint /api/v1/users (which is to register) to put any initialized field that isn't id or name to null.

You might say I could just make sure it's 0 or set it to null manually. Yeah, that's true, but I want to find out if there's an automatic and more comfortable way of doing this with annotations or something similar.

EDIT 2

Resource example:

```<code>@Component
@Path("iniciativas")
@Produces(MediaType.APPLICATION_JSON)
public final class IniciativasEndpoint {
    @POST
    public Response crearIniciativa(@Valid @NotNull(message = CONSTRAINT_BODY_NOT_NULL) @ConvertGroup(to = IniciativasGroup.Create.class)
                                        final IniciativaDTO iniciativaDTO,
                                    @Context UriInfo uriInfo) {

        return Response.ok().build();
    }
}
</code>```

答:
You can use Jackson's JsonIgnore Property for this like:

```<code>@JsonInclude(Include.NON_NULL)
public final class IniciativaDocument {
    private String id;
    private String name;
    private String surname;
    private String address;
}
</code>```

So Basically what it does is, when it is mapping this class to Json it will ignore all fields with null value. And if you want it not to apply on whole class you can do it on fields as well.

AND If you want to achieve it through front-end then you can use this great api GraphQL, so basically in request you will specify what fields you require and it will return only those fields.

Body:
I would like to know if there is some way to filter the properties of an object that a resource receives.

Let me explain myself: lets say we have this object:

UserDTO

public final class IniciativaDocument {
    private String id;
    private String name;
    private String surname;
    private String address;
    private Double balance;
}

And for a resource I only need the properties "name" and "surname" but for other I only need "address" and "id". Is there any way to make the unneeded variables null automatically with something like Jackson?

My goal for this is that if the client sends a request with a field that isn't needed that I don't have to make it null before saving it to the database because that field is not supposed to be initialized when registering.

Thanks.

EDIT 1

For more clarity: this is for a matter of security and easiness.

Imagine I am a hacker and somehow know the fields a DTO class has. I could easily send a POST request like this to a service which is to register users:

{
   "id": "wrong",
   "name": "Wrong",
   "balance": 20000
}

For my service I would only need id and name but the hacker is sending a balance field too.

What I want to do is that as I receive this object, I can set my endpoint /api/v1/users (which is to register) to put any initialized field that isn't id or name to null.

You might say I could just make sure it's 0 or set it to null manually. Yeah, that's true, but I want to find out if there's an automatic and more comfortable way of doing this with annotations or something similar.

EDIT 2

Resource example:

@Component
@Path("iniciativas")
@Produces(MediaType.APPLICATION_JSON)
public final class IniciativasEndpoint {
    @POST
    public Response crearIniciativa(@Valid @NotNull(message = CONSTRAINT_BODY_NOT_NULL) @ConvertGroup(to = IniciativasGroup.Create.class)
                                        final IniciativaDTO iniciativaDTO,
                                    @Context UriInfo uriInfo) {

        return Response.ok().build();
    }
}

Body:
You can use Jackson's JsonIgnore Property for this like:

@JsonInclude(Include.NON_NULL)
public final class IniciativaDocument {
    private String id;
    private String name;
    private String surname;
    private String address;
}

So Basically what it does is, when it is mapping this class to Json it will ignore all fields with null value. And if you want it not to apply on whole class you can do it on fields as well.

AND If you want to achieve it through front-end then you can use this great api GraphQL, so basically in request you will specify what fields you require and it will return only those fields.


问:
update a column when multiple records of another columns of same table matches
I have table as below:

```<code>            Input table:
            RequestNumber            TrackName         Date
            -----------------------------------------------------------
            02209                    Middle         2017-05-28 00:00:00
            0263                     Middle         2017-06-29 00:00:00
            0633                     Middle         2017-09-10 00:00:00
            0762                     Back           2017-06-23 00:00:00
            0762                     Front          2017-06-23 00:00:00
            0762                     Middle         2017-06-23 00:00:00
            01839                    Middle         2017-03-09 00:00:00
</code>```

I need to check, if "RequestNumber" and "Date" is same for "TrackName".
if multiple reacords of "RequestNumber" and "Date" matches then I should update the "TrackName" column as "All three" as below
output example (in this example there are 3 records matching)

```<code>            Output table:
            RequestNumber            TrackName         Date
            -----------------------------------------------------------
            02209                    Middle         2017-05-28 00:00:00
            0263                     Middle         2017-06-29 00:00:00
            0633                     Middle         2017-09-10 00:00:00
            0762                     All three      2017-06-23 00:00:00
            01839                    Middle         2017-03-09 00:00:00
</code>```

To get the above desigred output this is the SQL I have tried. Howveer, its updating all TrackName to All three.

```<code>            UPDATE a
            SET a.[TrackName] = 'All three'
            FROM Table1 as a
            INNER JOIN
            (SELECT [RequestNumber], row_number() OVER (ORDER BY [RequestNumber] DESC) as rowNumber
            FROM Table1 ) drRowNumbers ON drRowNumbers.[RequestNumber] = a.[RequestNumber] and drRowNumbers.[Date] = a.[Date]
</code>```

Hope I have explained this correctly. What am I doing worng? Any query to fix this please?

Note: The records are coming dynamically so can not be hardcoded(if any).

Thanks.

答:
I think you want SELECT statement :

```<code>SELECT t1.RequestNumber, (CASE WHEN COUNT(DISTINCT t1.TrackName) = t2.TrackNo
                               THEN CONCAT('All ', t2.TrackNo)
                               ELSE MIN(t1.TrackName)
                          END) AS TrackName, t1.Date
FROM table1 t1 CROSS JOIN
     (SELECT COUNT(DISTINCT TrackName) AS TrackNo FROM table1) AS t2
GROUP BY t1.RequestNumber, t1.Date;
</code>```

Body:
I have table as below:

            Input table:
            RequestNumber            TrackName         Date
            -----------------------------------------------------------
            02209                    Middle         2017-05-28 00:00:00
            0263                     Middle         2017-06-29 00:00:00
            0633                     Middle         2017-09-10 00:00:00
            0762                     Back           2017-06-23 00:00:00
            0762                     Front          2017-06-23 00:00:00
            0762                     Middle         2017-06-23 00:00:00
            01839                    Middle         2017-03-09 00:00:00

I need to check, if "RequestNumber" and "Date" is same for "TrackName".
if multiple reacords of "RequestNumber" and "Date" matches then I should update the "TrackName" column as "All three" as below
output example (in this example there are 3 records matching)

            Output table:
            RequestNumber            TrackName         Date
            -----------------------------------------------------------
            02209                    Middle         2017-05-28 00:00:00
            0263                     Middle         2017-06-29 00:00:00
            0633                     Middle         2017-09-10 00:00:00
            0762                     All three      2017-06-23 00:00:00
            01839                    Middle         2017-03-09 00:00:00

To get the above desigred output this is the SQL I have tried. Howveer, its updating all TrackName to All three.

            UPDATE a
            SET a.[TrackName] = 'All three'
            FROM Table1 as a
            INNER JOIN
            (SELECT [RequestNumber], row_number() OVER (ORDER BY [RequestNumber] DESC) as rowNumber
            FROM Table1 ) drRowNumbers ON drRowNumbers.[RequestNumber] = a.[RequestNumber] and drRowNumbers.[Date] = a.[Date]

Hope I have explained this correctly. What am I doing worng? Any query to fix this please?

Note: The records are coming dynamically so can not be hardcoded(if any).

Thanks.

Body:
I think you want SELECT statement :

SELECT t1.RequestNumber, (CASE WHEN COUNT(DISTINCT t1.TrackName) = t2.TrackNo
                               THEN CONCAT('All ', t2.TrackNo)
                               ELSE MIN(t1.TrackName)
                          END) AS TrackName, t1.Date
FROM table1 t1 CROSS JOIN
     (SELECT COUNT(DISTINCT TrackName) AS TrackNo FROM table1) AS t2
GROUP BY t1.RequestNumber, t1.Date;