ansaurus

Question

Answer 1

+1 A:

Is it possible to use a php file just for rendering the image? That php file could write some base64 encoded values via

echo base64_decode($_GET['data']);

while you embed images like

<img src="http://host/yourPhpFileForDecode.php?data=base64encoded.../&gt;

Juri Keller 2010-06-09 22:24:22

Would the response headers also need to indicate which format the image is in? (e.g. gif, jpg, png)

Ken Browning 2010-06-09 22:25:45

also keep in mind that URL length is limited to ~2KB .. so there is a big limitations to what you can pass around through the URL ..

Gaby 2010-06-09 22:32:31

I think so, yes. But you could pass it to the php file via GET, too and set it there dynamically.

Juri Keller 2010-06-09 22:34:42

@Gaby: you are right. To make this solution even more complex (and I'm pretty sure, that there is no easy solution, as the "data:" way won't work on ie < 8 and is limited to 32kb, afaik) you could generate a ajax post request to the php file which updates your image/div.

Juri Keller 2010-06-09 22:41:26

@BobRoss, indeed that would be more feasible. Sounds like an interesting concept:)

Gaby 2010-06-10 00:04:13

Answer 2

+2 A:

Encode the images using base64 and write them out in a CDATA string into your XML with this format:

data:[<MIME-type>][;charset="<encoding>"][;base64],0123456789abcdefg...

When constructing your document, use this string as your src

<img src="data:image/png;base64,0123456789abcdefg..." />

Andrew 2010-06-09 22:29:57

Very cool - does this work in IE6/7?

Ryley 2010-06-09 22:35:25

It does. It may not work in some applications, but web applications should have no problem. Give it a whirl. Very easy to implement.

Andrew 2010-06-09 22:37:53

Are you *sure* that IE supports "data:" URLs? Everything I've read suggests that IE supports something that's kind-of similar, but definitely different.

Pointy 2010-06-09 23:16:55

Thanks for your quick reply.I've tried your suggestion because it matches what I had in mind the closest but my implementation fails to work, can you pick out my error?var hexString = "FFD8FFE000104A...";document.getElementById("output").innerHTML = "Picture: <img src=\"data:image/jpeg;hex," + hexString + "\">"

Gunnar Hoffman 2010-06-10 00:05:45

I should also clarify that by cross browser I mean the newest versions. Because of the nature of my user base I have the ability to guarantee that they have such software.

Gunnar Hoffman 2010-06-10 00:11:22

ansaurus

tags:

views:

answers:

Javascript Hex String to Image

related questions