简体   繁体   中英

raw image data to base64

I am using this function to convert raw image to base64 but unable to generate image.

Here is the plunker: https://plnkr.co/edit/pn9xNwgR3p1RDqZhVNne?p=preview

  <body>
    <img src="" id="myimage" />
    <script src="script.js"></script>
    <script src="jpegEncoder.js"></script>

    <script>
      var rawImage = "����JFIF���&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#13;&#9;&#9;��``&quot;����?&#9;!1AQaq2B���&quot;#RT����br��3����������0&#9;!1A2Qaq�&quot;��BRS�����?���Kѐ�V��,���fu0�AկQ�w���y�x��i�|��F?���;҆�X����������(+:s��iud���c�Gf�e7�jI�;N�d�%�f����+�Uh4q;Ĭ!9ȨD��[��5�ކ�;h��gCt�͌��و1J��q�a��S��^�V���R�����U��K6�&lt;��&quot;�U��~&quot;u�|Q&#10;��c�F�IoZЩX���4����\��]Kp�3K'�(#�G�ր^�d���f�FU=#C\@9�Q��g�ݠ�8Ϧ����m���fq$�jMq;���LW����+�&#13;ڵ��G���;}�ђ׊��&lt;���sX���&gt;j���hk���~+�^����3�q4��P؝�oZ������4��P{O-j�]�d�c��pG��&lt;7��Q������zd{n��|�`�mɊ��SN�D����}�Hv��0PY�&lt;\�#�T�k!0�R(�Um�n��e�&gt;�a욶˽�8P����{�)���&quot;����;#~,&lt;+��iA����!�nխ]f�We��q��&#13;�4��}����6�`���T��!wY�� ��4�y�����+�A]U�M�ֻ⼪�d�N��EcQ`a�u�R��Z&quot;�e/���;-�vL�&lt;c���IH&quot;W2Ga���Ӄ⬨�cݻ#q��c�Y䣃F�G�$�0:�z�&quot;&#9;1���S�R�WCh��a���@%#��$�i�y�u��[�6Ή����(c�Sw˻�G��X3����R��n'�m+&gt;����'�/;�%�k�4��Z�/l^�z�/l^�z��Z�}k^��!������O����������Dzx�&quot;��&gt;��û#&gt;�#\~{�L-D�k��T�L��O=�I��\Qy$�1�'&lt;��=�����uR�b�&#13;���({�TAr9����g}׎��y�{Լ�.�у�8���^��6��&quot;9+��k��K�V�6�����p�¦�Y�~%b�F�lX����_���v����_�O����A�+�G��e]Q*���z��G|�Y{��f��Y�CI�qu*p�v�T�Z�%0�J4�l�3�ɖ�yF���&quot;�5�\�@ܧ���&#13;*R�Kx��c��Is�D�Y�-���O$��!�`��4M���VX�@v�g��U�̦��2E�W��s�7=}z#��Ԯ� c���t^��n|R2H΋�� |�����w�k�9��ٵ�o1�U��nC�r@���7���wZ��-�!n����v�p���P�h_dR�����O5�ޟ���&lt;U����&#13;�*&quot;̙����7-rr�{��&lt;��3��#O�S;:/~�&quot;f~Ϋ;IǸ,�V�[Kv�\���՗c���d4`6��ѣ��Õ]&lt;ϚN��&lt;��r/Fug&lt;֧���ӢуZ�&gt;z�Cܟ{'c��ˏO��jB��o �����c5�:�6:H�Ώ�c�S&lt;�}{���,���o�_8תޫ|{Qm~�kU w��Zi����5B��vƮ�Y�5�Hǽ��U6�^�VKd)��FZ��ʗ���ݹ�E�]tV��&#13;&quot;�� y���a�%���h�����=v�&amp;5� �ג3䒮i�Wq�#�$J  �ǖ+��`4&quot;&#13;U_c+�T&#9;D����JY!Mhv�1�N Q���ǘH��e�#�!��/X��GO��iC�8&gt;ȅ:���`$���H��m&#13;!� ��H�Op��)�&amp;Q���P۷��'�;S�������";
      var encoder = new JPEGEncoder(9);
      var jpgFile = encoder.encode(rawImage, 9);
      console.log('jpgFile: ', jpgFile);
      document.getElementById("myimage").src =jpgFile;
    </script>
  </body>

I get this output: data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wCEAFk9Q05DOFlOSE5kXllp…rCw8TFxsfIycrS09TV1tfY2dri4+Tl5ufo6ery8/T19vf4+fr/2gAMAwEAAhEDEQA/AP8A/9k=

The raw image data I received on ajax call to google contacts api

Is there anything to do with encoding?

Update

When I hit the api directly using the url: https://www.google.com/m8/feeds/photos/media/kookootalk%40gmail.com/3e98af288ff825f7?access_token=ya29.CjDJA08-At3FiI0G1yXER2a-bWpScqI9vcopzjSjXe62CnvlrFMMq0noIghnPdxd1Yk

<img src="https://www.google.com/m8/feeds/photos/media/kookootalk%40gmail.com/3e98af288ff825f7?access_token=ya29.CjDJA08-At3FiI0G1yXER2a-bWpScqI9vcopzjSjXe62CnvlrFMMq0noIghnPdxd1Yk" />

I get the image properly and If I inspect the network, I find the raw image data as response:

`ÿØÿàJFIFÿÛ

ÿÀ``"ÿÄÿÄB !1"AQaq¡2BRb±3Sr¢ð£²Áá$csÂÃÒÿÄÿÄ2 !1AQaq¡ÁÑð2R±"#BbáÿÚ?¹p¡iÖ?&Í)§Mj üÌÇ%QÅ/ ±7¤øéUø:à"h ATj9FuÅ(hlçhsìl¥ä½(¹´¢}êôO}A÷#±ßª\\ôI%%È{~Óè}üªÕÂÍ[Órl¦3âaaçAb ´) )PÀÓl´ «3Af' zÆ nÒõÝí³Ëâ$¡"J(µÅÈößy ¥¯Ú?XîJK éÛÓ)÷H}üW+hº×¸úúýAç®ÊF çS4jõ»ÇTp~¢2?ÛnùS¦êcTÈéð 5¸Æ$Ä»R5Ñjß'ï\\^}ÓBçE"xÛ9Ñrpi%øW(i1-|Bh4í" Z®+Ùó ±D%lçENÂLó{OY(jÞb#ºf]&¬Ú±§Ä3Sâ:ãDèÏBÎ áók¥$d|½è Æ01>MQx7Ìc¡5Qàÿ1¼Ghº³ÀÓNÊ5Ù¬s±$È@¸r£Ú^4Íj1 ¥ª8 b8""¸®¡Hâç0_Ùc$T¼jnÝ95QÈPA-ñêÀöcTÝ'i°ÐÀìWo@]±é^Ý8×v[ KÙ(Q¿y|÷Ä6r9×qÙ¦§^5¸´Ù{Yجr:¼É®xrSQ}'cïÆäL ÐðÇõPZçïW M÷«[ëÂñì©Ê ÄIJõ¹gÙ_äOd¶6z6оÎZ_p+{¼ÄHÐúIA¾5Ð1t¯®XzÒúOaßå¯6¯LÙ¬æâ&ãºn®%K¨´ºHÄ@ Ã#õÏÎ< @jA ó¼ÒrLÈYZÍ iÀPF£"pRÙ¾3°²ÚMðû²æ>&¤}Â} ÙδµcxA PF ëåÂÞÔæKnã¾)q I£®ÑB[Ð Óöq¬eØG8äáþÙ?¥³IsdF ?êK«yÓÂG%éඳoÎtæ·J/ÇJspïªSnÎ^MU=ùy4Ú=¨èy:ÿ°,ÉmÁ¸Ío5ÚR{ »i¹WfÍ^+6bÕvÊ9"[¶]e[çQf0½E[÷ÇtDa¡®nÙiå î$yצ Óh¹Öaé©ã$¾âÍv¾éL6KâÉ>®OA4îÐ)îA÷Xñ3¾Ð±ºY."Ë+?¶½½û5úÊ ¡´ÍDf&ÕfÖfû¢o¶=$ºzJÞUƵ" à-l 3fpä=©¶{Æðjlëax+fãÆ1àRp¤3$ä;ÎI4pbIäÄ¡]ê?EýîÕDÅôG »Aö}£\\ÁÄÒF7P+YÏpã_E¹ÕNÍæ¦Ö«7Eg'"/ûh>4¥'né´ St :ÇyG0JÒ;p[Ù³ÃýÆÖ:éM(ÙaZº}F¸qÕy7¦¯»V=Ùy 2^Ûcy!z)]ý¥uh¼¤µ(Þ»2räo|NÀìxE~¬]ËeYYVYH¨*ÂäFSv§©bS!É2ãUâ}´È×1Fâ@t<åI]%·¯ dv÷üùEkÆ°õS©¢mÓdÜ'îà9ôoBPõb½U5ö¥¢çc>Ì׿Ä.wÊÀÞü£²1á1¹·Üo4%ó*25qÆ6hɶ{3>Ä©rÄÕ¼>Sz·¬'?¤D²YØ2ÉJÜiù˾Ç_Úc@£ 0è^c¬´w ¨9³Áıº¥¡Ï%$®7Fó{NØ»óÅ«AÀPpþ^Ä}@¯Ô¬¹o«¾&MÙýw²mÃÔÓ¨ì(ðWSN1-Ô«¹¾_d{ÍOe!Aèã5©êHÿÄu!( KJyÑRúã!}O¥ºÊt)çYhÖ½_iÒfänæV2Uî5ï U_Z´¨b Tm£ìþÑbbXNäåbpYÔ|;§Ì1xRV©ÀAÌp ò0(×-Ù¦öw6w8Ü¥ùêJN[t{1lýµJ¸èÂÁ+àvò>þu]#E¡à§vG¤¥e$MÔVürgpS&¤[fNI-f´ËÔgyUsf¼RíBA\\ZG_í¤©[ª¾d®6[ ¶|*Øf®Tµ±Ç4ô3þ°Ìæ ·H×£4YEYi)Â"PðU®|Ï|:Y´æõnn@òo ¨t\\Cdîõ´Åju#3ÚwÓq1Ý¡ôSÍ8 ¨9³Áıº¥¡Ï%$®7Fó{NØ»óÅ«AÀPpþ^Ä}@¯Ô¬¹o«¾&MÙýw²mÃÔÓ¨ì(ðWSN1-Ô«¹¾_d{ÍOe!Aèã5©êHÿÄu!( KJyÑRúã!}O¥ºÊt)çYhÖ½_iÒfänæV2Uî5ï U_Z´¨b Tm£ìþÑbbXNäåbpYÔ|;§Ì1xRV©ÀAÌp ò0(×-Ù¦öw6w8Ü¥ùêJN[t{1lýµJ¸èÂÁ+àvò>þu]#E¡à§vG¤¥e$MÔVürgpS&¤[fNI-f´ËÔgyUsf¼RíBA\\ZG_í¤©[ª¾d®6[ ¶|*Øf®Tµ±Ç4ô3þ°Ìæ ·H×£4YEYi)Â"PðU®|Ï|:Y´æõnn@òo ¨t\\Cdîõ´Åju#3ÚwÓq1Ý¡ôSÍ8 [êòyýªè1s|òÉ<1-ÞiÕRÀÂËÂZ´AEAÉ/´zjòUØaªÏiÑÖ%E ¢x²xÎ:aBú$%#($MÿÙ`

But the problem is the token inside the url has expiry time eventually link will expire.

I don't understand the difference between the two image data's I received where one works and other doesn't

The Contacts API is a secure sync API, not meant to be used in the same manner as an image host. When your OAuth session is active, the intended usage pattern is that the data is downloaded and presumably stored in some fashion. For an image in JavaScript that would likely be a canvas, or an img tag with a src value of a base64 encoding in a data URI .

I'm not sure how you're fetching the first image in your JS snippet but I can clearly see HTML entities within the string so at some point the data was corrupted presumably while being treated as formatted text.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM