3

I have situation here where I am getting PNG image as response from REST call in servicenow, The response is in junk character as shown below, I am writing server script which takes the response and convert in some string, which will be return to client UI action script to render as image back to UI page. I was not able to find any similar cases if someone has encountered similar situation please do share. any help would be appreciated

REST Response:

    IHDRU�  ��bKGD������� IDATx��{\T��� o"r�("r ���J(/���L��f�Syˬcio ��x��T�
    S�$=��JO�GE1 �xA@ T  �\��g���53kX��}? >ʞg�<���ڿ��� �/_V� � �Л���hj A A r������Ro�ݻwS�!� ��%���@�*� � c@�*� � #@�*� � #`�[B A a~DEE5�=44���T�"� �h���P���bԨQ�� �*UA A Z(++Crr2,--��� ++�C' T A A4��۷����nݺ�gϞ8�<z��UO�*� � �x��!� 
    kkk@HHH�z T A A4@nn.rss�m���A A  �Du� � #A � � �  �&����ӧn��M� �  ���zPU^��|�)`�/���u�&vD A DS�:Q�U·����=���.X�Ď� �hj,,,0z�hXXXT* ���������{�p��o5����[�� � ���� ������AMM 233akk�Uo����W���\�{Uy9��^݄�� � �~��!++ ǎ ñcǐ��   �z� TM  ����(�9 o''���dL  k�9YYY��g�@ٱcLz�^X�r� �y��E��Y�� ��r�ͪ�kVx�f��5+��vJ��� � Ƙ1c0f�   < gΜѪ7�A�>TTTp��E�v�xa���7�杧 ��f�SV ���7�^�Y��U/׬���� ���666�t���\�P]Q����E/W��w�^��UOY1\/W�O�-.Z���M�]�Ӹx�k�Y�r�
    KN��Y)..��1����� �/_V@�޽�b@�|��'X�n]S� �h�T�*��R+IZ�@ g7������ c � "**�ޒ
    ������^��I?rb�@��EHE�¢��o��;O/r�ͪ�� ���o����T�vR� �jʸx�k�Y�r�
    KN�ڬ��� �*++�P(���HOO��$ �� R�9..Lz��Y|����;== 6���>O��S ߬z ߼�o<��<s+W�j}��L��ҫ�ӺءBU!��M����� �_aɉ�� ?{��<?%%
    ��y��T ��2��{ �鿴�4��� ] � %�0�*��  �\}l�yz��oV=e�p�\}�� = `�^�vR� ���;K;�{�k�Y�r�
    KN�ڬ�47S�N������͛��lll��� GG�::��? T=��T A�E�= �ߔ�I���% ���KN>s�� ?�~��iQyyyHLLDppp  ͩ2Q�g��"� �'�0��f�SV ��
....truncated since its too long
Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
user3337753
  • 29
  • 3
  • So I'm clear -- the client performs a request, the server responds with some kind of binary-to-string PNG representation, and you want to convert the "PNG-string" back to an image on the client side? – Willy Feb 21 '14 at 15:15
  • In Servicenow, there is catalog client script which calls server script, the server script invoke REST call (this is separate module where it handle REST Message), the response from REST call is the raw junk as mentioned in post, So in server script I have convert in some base64 format which will be send back to client script which indirectly post in UI page – user3337753 Feb 21 '14 at 15:21

1 Answers1

0

Your are passing the data as binary... old javascript can't handle binary data.

This is the correct/modern way to display ajax images.

but check compatibility ...

https://developer.mozilla.org/en-US/docs/Web/API/URL.revokeObjectURL

function showImg(e){
 var img=document.createElement('img');
 img.onload=function(e){
  document.body.appendChild(img);
  window.URL.revokeObjectURL(img.src);//Clear
 };
 img.src=window.URL.createObjectURL(this.response);
}

window.URL=window.URL||window.webkitURL;

var xhr=new XMLHttpRequest;
xhr.open('GET','/path/to/image.png',true);
xhr.responseType='blob';//Blob
xhr.onload=showImg;
xhr.send();

there is a more compatible way to d o that with

new Uint8Array

but i noticed some memory leaks.

if you want i can also post that code.

cocco
  • 16,442
  • 7
  • 62
  • 77
  • if you plan to use this pay attention on the memory that the script uses ... it's very memory intense. So delete every image you create properly else you will fill it up very fast.btw i didn't downvote.. this happend also to me. – cocco Feb 21 '14 at 15:33
  • The issue is I am using the REST api which comes with servicenow, this is how script include (server script) looks which basically does all server side processing var tmk_pull_graphs = Class.create();tmk_pull_graphs.prototype = object.extendsObject(AbstractAjaxProcessor,{ getgraphresponse: function() {var r = new RESTMessage('tmk_xxxxx_get_graph', 'get');r.setStringParameter('graphurl', this.getParameter('sysparm_io'));var response = r.execute(); so the response object need to be convert in form base64 format which can be send to client script and wich render as img src="data:image/png;base64 – user3337753 Feb 21 '14 at 15:42
  • window.URL.createObjectURL == data:image/png;base64, test the code and check the image link. – cocco Feb 21 '14 at 15:46
  • but I need to convert the raw junk I am getting in base64 format which then only can send to client script which will send in UI page as data:image/png;base64{response}, I am finding hard time to find javascript api to convert that junk – user3337753 Feb 21 '14 at 15:58
  • 1
    i think there is also a function to convert your data inside the library you are using.i showed you the modern/native way to do that. – cocco Feb 21 '14 at 16:00