Hackszine.com: RFC 2397 - Embed image data inside a URL

RFC 2397 - Embed image data inside a URL

I discovered a URI called "data:" today which allows you to encode any amount of file data into a URL. This data could be an image, ascii text, xml data, you name it. You'll have to read the details, but you use it like this:
data:image/jpeg;base64,base_64_encoded_jpeg_goes_here

The RFC was drafted in 1998, so it's by no means new. It was news to me, though, and it's got me thinking of all sorts of interesting applications, especially since it appears to be implemented in standard browsers. Some things that you might be able to do with this include:

javascript based image editor

storage of attachments within a web page or blog entry (simplify file hosting)

post images or files to forums that allow url posting

sneak attachments past grumpy email filters

Anyway, those are just some initial ideas. You probably have better ones, so let us know in the comments.

Me, encoded in a data URL - Link.
RFC 2397 - Link.
Convert a URL or uploaded photo to a data: URI - Link.

Posted by Jason Striegel | Nov 12, 2006 09:35 PM
Web | Permalink | Comments (8)

Comments

Newest comments listed first.

Posted by: Rayvan on December 20, 2006 at 5:19 AM

encoder is dead.

Posted by: gavri on December 20, 2006 at 7:49 AM

IE hasn't implemented this.
And it would have been more impressive had you used it as the src attribute value in an img tag :)

Posted by: honeybuzzer on December 20, 2006 at 12:21 PM

I can see all sorts of uses for this--if IE supported it.

Posted by: pixelman on December 20, 2006 at 2:05 PM

Interesting find.

This appears to work in Firefox but not in IE6 which gives an "unknown zone" security message in the status bar and "invalid character" error in a popup.

If this worked cross-browser, another handy use for it would be embedding JavaScript in a script tag to obfuscate your source.

Posted by: brianiac on December 20, 2006 at 4:01 PM

Best uses: as bullet or background images embedded in CSS, or for images in AJAX HTML editors that do not include full image file management.

For a complete analysis, see http://en.wikipedia.org/wiki/Data:_URI_scheme

Posted by: Locuester on December 21, 2006 at 4:51 AM

Hey there, Software Jedi here....
I created an app to help you encode these HTML tags as part of my AnAppADay craziness. Check it out here:
http://www.anappaday.com/downloads/2006/09/day-4-base64-file-encoding.html

Posted by: dylan.berry on December 21, 2006 at 9:34 AM

Be aware that this URI scheme DOES NOT work in Internet Explorer, that includes the recently released IE7. The "data:" URI scheme is not supported.

Posted by: zcoelius on August 17, 2007 at 3:09 PM

Great stuff. We are working on an embed tool that might be able to make use of this. Thanks