Comment by myfonj

Comment by myfonj 5 days ago

5 replies

You don't even need the base64 encoding for dataURIs: just throw the text payload after mime-type and a comma:

    data:text/html,<!doctype html><title>Hi!</title><p>Hello.
This is also a valid self-contained HTML document. You have to add `;charset=utf-8`, if you need to go beyond ASCII, and for some browsers watch for URI-encoding of some syntactically significant characters (like `#` and `%`, `?`).

Base64 is indeed good to be "safe" and/or somewhat 'conceal' the payload, but it also makes it larger by 1/3 (every three bytes of input become four characters of the base64 output). So taking the risk some devices would not like raw "ASCII dataURI", the QR of the backrooms QR could shave off 738 bytes.

BTW, this is my "HTML sandbox" for testing stuff in a browsers that I summon daily through keyword bookmark to test simple stuff:

    data:text/html;charset=utf-8;verbatim,<!doctype html><html style="color-scheme:dark light"><title>HTML sandbox 2.0.6</title><meta name=viewport content=width=device-width,initial-scale=1><body style=margin:0;display:flex;height:100vh onload="OT=(DC=document).title,H=(L=location).hash.slice(1)||'',RX=/(^data:.+?(;verbatim)?,)?([^]*)/,A.value=H.match(RX)[2]?H:decodeURIComponent(H)||A.value;T=W=0;E=RegExp('^'+(D='data:text/html;charset=utf-8,'));F=()=>{if(W!=(V=A.value))W=V,M=V.match(RX),I.src=M[2]?V:(M[1]||D)+encodeURIComponent(M[3]),DC.title=NT=((TM=V.match(/<title\b[^]*?\x3E([^]*?)<\/title\b/m))&&(NT=TM[1])&&(NT=NT.trim())&&(DC.title=NT+' @ '+OT))||OT};F()"><textarea autocapitalize=off style=resize:horizontal;width:50vw autofocus id=A onkeyup=clearTimeout(T);T=setTimeout(F,400) onblur=try{history.pushState({},NT,'\u0023'+(S=I.src.replace(E,'')))}catch(e){L.hash=S}><!doctype html><html lang="en" style="color-scheme: dark light;">%0A<meta name="viewport" content="width=device-width, initial-scale=1">%0A<title>%0A%0A</title>%0A<style>%0A%0A</style>%0A<body>%0A%s%0A<script>%0A%0A</script>%0A</textarea><iframe style=border:0;flex-grow:1;width:0 id=I>
reaperducer 5 days ago

I think I'm going to find this useful.

Duck browser doesn't allow it to be saved as a bookmark, but Safari is fine with it.

  • myfonj 5 days ago

    Yeah, sadly, top-level dataURIs are increasingly neglected and banished from browsers, mainly because they were misused for scams in the past; for example no modern browser allows navigating to top-level dataURI by clicking a link. Only bookmarks, manual entry, and external invocation (share) work (sometimes).

    Anyway, I have put some remarks and docs for that thing into https://gist.github.com/myfonj/c8ce74bf549e19600026ce9022388... , if you are interested.

    By the way, this "Backrooms" can also work from non-base64 URI and as such is significantly smaller (https://github.com/Kuberwastaken/backdooms/pull/3#issuecomme...)

    • kuberwastaken 5 days ago

      Awesome stuff! I'll play around with it in a bit!

      Thanks for sharing :)

      • myfonj 4 days ago

        My pleasure :] N.b., if you'd like to try fiddling with Backdooms in that Sandbox, either use the "original" HTML payload (with or without `data:text/html,` prefix in the content), or use "verbatim" (`data:text/html;verbatim,` prefix) when trying that last dataURI payload from the comment, otherwise all `%23` would be double encoded, so you'd get wrong colours. ";verbatim" turns off implicit URI Encoding. (It is not part of the tech, just my hacky hatch to be able to test both "true" dataURIs that can be used "verbatim" in URLs, or have convenience of auto-encoding, but have to extract sandbox iframe resulting payload afterwards, for "ejecting" the "project".