2

I am trying to display image form server side image data using ajax call.Server side data is something like this:

"ÿØÿàJFIFÿÛC4­¶¸UOHlʵcBò)3¹_È'I4~&éüÿ§Ú<ã©ã4>'Øù¿ÇÄmËCÈgÚsZ¥ë"

In success of Ajax call i assigning this data to the following variable present in java script file.

$scope.imgData = <above data>

HTML code:

<div class="col-md-12" > 
  <img src="{{imgData}}" alt="embedded folder icon"></img></div>
</div> 
Shadow The GPT Wizard
  • 66,030
  • 26
  • 140
  • 208
Dnyanesh
  • 79
  • 2
  • 10
  • 2
    You'll need to use base64 image data: http://stackoverflow.com/questions/1207190/embedding-base64-images – Cerbrus Nov 23 '15 at 09:51
  • Maybe this post will help you. http://stackoverflow.com/q/24787880/1165289 – Bernhard Nov 23 '15 at 09:52
  • 1
    Seems quite wasteful to use Base64. Why not just get a URL via Ajax and load the image from that URL (can still be dynamically generated on the server)? That would also work better with caching. – Thilo Nov 23 '15 at 09:56
  • I try to encode that data using jpeg-encode function that you will found in following link: "https://github.com/owencm/javascript-jpeg-encoder/blob/master/jpeg_encoder_basic.js" – Dnyanesh Nov 23 '15 at 09:57

1 Answers1

1

Here i got such response that i specified above because response containing an image and i was trying to read it as text. Here i just put my ajax call url in src and i got the image.

Javascript Code: $scope.imgData = 'secure/image/preview?fileId=1203598625.jpg'

URL method is: GET

HTML code:

<div class="col-md-12"> 
  <img src="{{imgData}}" alt="embedded folder icon"></img></div>
</div>
Cerbrus
  • 70,800
  • 18
  • 132
  • 147
Dnyanesh
  • 79
  • 2
  • 10