Hacker News new | ask | show | jobs
by pudquick 424 days ago
data: URI URLs aren't supported in it, it has nothing to do with the size / length of the QR code

For example, this self-contained webpage: <html><body>Hi!</body></html>

encoded is: data:text/html;base64,PGh0bWw+PGJvZHk+SGkhPC9ib2R5PjwvaHRtbD4=

If you paste that into a browser, it will render "Hi!". Very short and easy.

But if you encode is as a QR code, it won't work in this situation.
2 comments
myfonj 424 days ago
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>
link
reaperducer 423 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.

link
myfonj 423 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...)

link
kuberwastaken 423 days ago
Awesome stuff! I'll play around with it in a bit!

Thanks for sharing :)

link
myfonj 423 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".
link
kuberwastaken 424 days ago
I think it's broken for safari but works on chromium based browsers on mobile too. The QR code basically holds the URI URL itself.
link
pudquick 424 days ago
I'm saying the primary gateway most iOS users are using for loading a QR code - the camera app - will not present a transition to load your URL in this situation

Whether the resulting HTML game is playable in Safari is a different discussion.

The QR code, as generated, is effectively "not clickable" for most iOS users, unless they are using something other than the most common way to read QR codes on their phone like a 3rd party QR code reading app or similar.

link
kuberwastaken 424 days ago
That I agree, yes haha
link