Page 1 of 1

Displaying image from binary var

Posted: Thu Sep 26, 2013 1:23 pm
by Ed Jones5461080

I'm trying to snap a photo (insurance card), save it locally, and retrieve it later.

I've managed to save the binary to localStorage
code
var policy_shot = localStorage.getItem( 'elephant' );
console.log( policy_shot );

$('#TestScreen_mobileimage_1').crossOrigin = 'anonymous';
console.log(policy_shot.length);
$('#TestScreen_mobileimage_1').src = policy_shot ;
/code

The console logs a binary; binary renders properly when pasted in a fresh browser tab:
code
data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDABALDA4
/code
And policy_shot.length logs at: 20203

But no image displays in the test. ( renders src="files/resources/image/no-image.jpg" )

Thanks, Ed


Displaying image from binary var

Posted: Thu Sep 26, 2013 2:43 pm
by Kateryna Grynko

Hi Ed,

Image component doesn't have "src" method, you can use "attr" method instead: codeAppery("mobileimage_1").attr("src","data:image/gif;base64,......");/code
And where did you get this code?
code$('#TestScreen_mobileimage_1').crossOrigin = 'anonymous';/code


Displaying image from binary var

Posted: Thu Sep 26, 2013 3:10 pm
by Ed Jones5461080

Thanks, Katya, that worked!!

This simple process was extremely hard to figure out. I'd been to dozens of pages looking for a how-to. It shouldn't be that hard!

The code you asked about was suggested by a contributor at Stack Overflow.
http://stackoverflow.com/questions/19...#
He thought CORS (Cross-Origing Resource Sharing) was blocking the render.


Displaying image from binary var

Posted: Thu Sep 26, 2013 3:15 pm
by Ed Jones5461080

Did I miss a documentation on this? It was REALLY hard to get to a solution to something so simple.


Displaying image from binary var

Posted: Thu Sep 26, 2013 3:36 pm
by Kateryna Grynko

Hi Ed,

Unfortunately there is no special documentation, but we're always here to help you!