0

I am having some trouble with displaying a binary image in my HTML from a database. First I am getting the image from the db, and then encoding the response as base 64 using the following function:

$scope.frontImage=$window.btoa(unescape(encodeURIComponent(response)));

Then in my html I am passing that into the img tag's source like so:

src="data:image/jpeg;base64,{{frontImage}}"

This, however, is not working. When I inspect the element it only says . The string I am getting from the btoa function looks like this (except obviously much longer):

77+977+977+977+9ABBKRklGAAECAQEsASwAAO+/ve+/vRLvv71FeGlmAABNTQAqAAAACAAHARIAAwAAAAEAAQAAARoABQAAAAEAAABiARsABQAAAAEAAABqASgAAwAAAAEAAgAAATEAAgAAAB0AAAByATIAAgAAABQAAADvv73vv71pAAQAAAABAAAA77+9

Any thoughts? Thank you!

Knut Holm
  • 3,988
  • 4
  • 32
  • 54
Natalie Miller
  • 1
  • 1
  • Looks like a duplicate of http://stackoverflow.com/questions/8499633/how-to-display-base64-images-in-html – Jason Mcmunn Jan 19 '15 at 16:03
  • I looked at that and a few other threads that seemed similar but couldn't find an answer that worked for me. – Natalie Miller Jan 19 '15 at 16:12
  • we don't have a lot to go on. Break the problem into pieces. Start with a good base64 converted image, use that data to display the image. Once you know that is working then focus on making sure the data is getting from point a to point b. Keep splitting it into smaller halves. Sorry if this seems vague. – Jason Mcmunn Jan 21 '15 at 22:41

0 Answers0