Embedding Image Code Directly into HTML

The data itself, not a link to the data file

[otem]

Is it possible in HTML to embed an image source directly into the code?

I'm not interested in linking to an image, but actually putting that information directly into my HTML document.

My site uses dynamic png images which I create using PHP to verify that a human is inputing data into a form. Right now I have traditionaly link to these images (php pages) and the requested file gives a png header and the image source code.

Since I'm using PHP to generate my html, I'm wondering if I'm just able to embed this code directly into my html reducing loading time and server requests.

An added advantage this might have would be I might not have to worry about the browser chaching the image.

Thanks.

[Little_G]

Hi,

There is the data uri scheme [en.wikipedia.org] but it's not supported by IE.

Andrew

[whoisgregg]

I'm afraid I don't have an actual answer to your main query. I can address one bit of your post though. :)

An added advantage this might have would be I might not have to worry about the browser chaching the image.

You can add headers to your captcha-generating PHP file to prevent caching (in most cases).

This thread [webmasterworld.com] has an example of how to achieve this plus a search at your favorite search engine for "php header prevent caching" should turn up plenty of results.

[otem]

Its a shame its not fully supported, that would have been exactly what I was looking for. Thanks for the information though.

Also, thanks for the tip about the headers. I currently do use headers to prevent caching, but this would have made them obsolete.

Thanks

[Little_G]

Hi,

One other possibility (maybe a long shot) is HTML Table images [neil.fraser.name] with a lower resolution to help with loading time.

Andrew

[edited by: Little_G at 5:02 pm (utc) on April 15, 2007]

[rocknbil]

My site uses dynamic png images which I create using PHP to verify that a human is inputing data into a form. Right now I have traditionaly link to these images (php pages) and the requested file gives a png header and the image source code.

I think I get where you're going - for security possibly?

What you can do is create a second script, call it an "image generator." Then do

<img src="img_gen.php?id=some_id">

img_gen.php would have to slurp up the file and output a content-type:image/png header (wild guess, you get the idea) and dynamically output the image.

If it's just caching you're worried about, generate a unique id for each image file name before output:

<img src="some_image.png?23456788">

[souFrag]

If it's just caching you're worried about, generate a unique id for each image file name before output:

<img src="some_image.png?23456788">

You may also add this to some_image.php so that a different filename is sent everytime to the browser:

header('Content-Disposition: filename=' . mt_rand(0, 9999) . '.png');