According to Wikipedia: Advantages: HTTP request and header traffic is not required for embedded data, so data URIs consume less bandwidth whenever the overhead of encoding the inline content as a data URI is smaller than the HTTP overhead. For example, the required base64 encoding for an image 600 bytes long would be 800 bytes, … Read more
Here is what you need. But it’s not cross-browser yet. Works in Google Chrome. <a download=”MyFile.txt” href=”https://stackoverflow.com/questions/6464828/your-data-uri-here” draggable=”true” class=”dragout” >Download ready</a> Also Wikipedia has a good article about Data URI
Split the data URI on the comma to get the base64 encoded data without the header. Call base64.b64decode to decode that to bytes. Last, write the bytes to a file. from base64 import b64decode data_uri = “data:image/png;base64,iVBORw0KGg…” # Python 2 and <Python 3.4 header, encoded = data_uri.split(“base64,”, 1) data = b64decode(encoded) # Python 3.4+ # … Read more
This should do it in Python: import base64 encoded = base64.b64encode(open(“filename.png”, “rb”).read())
A quick look at the PHP manual yields the following: If you want to save data that is derived from a Javascript canvas.toDataURL() function, you have to convert blanks into plusses. If you do not do that, the decoded data is corrupted: $encodedData = str_replace(‘ ‘,’+’,$encodedData); $decodedData = base64_decode($encodedData);
I’ve done a more recent test at Litmus, with data URIs for inline <img> elements and css background images. These desktop clients do show data URIs: Apple Mail 5 Apple Mail 6 Lotus Notes 8 Outlook 2003 Thunderbird 3.0 Thunderbird latest These mobile clients do show data URIs: Android 2.3 Android 4.0 BlackBerry 5 OS … Read more
Characteristics of a data-URI A data-URI with MIME-type text/html has to be in one of these formats: data:text/html,<HTML HERE> data:text/html;charset=UTF-8,<HTML HERE> Base-64 encoding is not necessary. If your code contains non-ASCII characters, such as éé, charset=UTF-8 has to be added. The following characters have to be escaped: # – Firefox and Opera interpret this character … Read more
Summary blob: for Chrome 8+, Firefox 6+, Safari 6.0+, Opera 15+ data:application/javascript for Opera 10.60 – 12 eval otherwise (IE 10+) URL.createObjectURL(<Blob blob>) can be used to create a Web worker from a string. The blob can be created using the BlobBuilder API deprecated or the Blob constructor. Demo: http://jsfiddle.net/uqcFM/49/ // URL.createObjectURL window.URL = window.URL … Read more
It’s not a good idea when you want your images and style information to be cached separately. Also if you encode a large image or a significant number of images in to your css file it will take the browser longer to download the file leaving your site without any of the style information until … Read more
Support, unfortunately, is brutal at best. Here’s a post on the topic: Embedded Images in HTML Emails And the post content: