Finally,,, portable html
Oct 16, 2024
Did you know you can send entire HTML documents as URLs?
As everyone knows, website URLs use an http
or
https
schemeāthe scheme is the bit that goes before the
colon. Almost everyone knows that is just one of many protocols most
browsers are capable of using. Some other popular schemes include:
tel
ftp
mailto
file
view-source
about
But only most people know you can also use the data
URI scheme! Hereās an example:
data:text/plain,hello%20world!
Copy that into your browser address bar and go, and you will see the text!
So you can encode most MIME types like this, including images, PDFs, etc. But since weāre in a browser, obviously the most fun thing to do is give it HTML because it will attempt to render the data.
data:text/html,<h1>Hello, World!</h1><p>Welcome to my website!</p>
You can also base64 encode the data, e.g., the same content as above:
data:text/html;base64,PGgxPkhlbGxvLCBXb3JsZCE8L2gxPjxwPldlbGNvbWUgdG8gbXkgd2Vic2l0ZSE8L3A+Cg==
Hereās a weird effect I got when I was playing around with this:
data:text/html;base64,PGJvZHkgc3R5bGU9ImJhY2tncm91bmQ6bGluZWFyLWdyYWRpZW50KHJnYig4NSwxMzgsMTE5LDAuNSkscmdiKDI1NSwyNTUsMjU1LDAuNSkscmdiKDE2NiwxMDgsMTU1LDAuNSkpLGxpbmVhci1ncmFkaWVudCgwLjI1dHVybixyZ2IoMCwwLDAsMC41KSxyZ2IoMTY2LDEwOCwxNTUsMC41KSxyZ2IoMjU1LDI1NSwyNTUsMC41KSxyZ2IoODUsMTM4LDExOSwwLjUpLHJnYigwLDAsMCwwLjUpKSI+PC9ib2R5Pg==
The obvious utility of this is sending your friends little HTML files without them having to download and open somethingājust click the link and the browser renders it!
I havenāt tested yet what the limits are with regards to sending a large amount of base64-encoded text content via chat apps or email links.