Comment by giarc
Comment by giarc 5 days ago
I scanned on an iPhone using native QR code scanner and it says "no usable data found".
Comment by giarc 5 days ago
I scanned on an iPhone using native QR code scanner and it says "no usable data found".
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>
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.
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...)
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.
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.
Hey thanks for checking it out! You'd need something like https://qrscanner.org/ because most phones suck at scanning larger QR codes.
Also, it won't work on your phone, can't put in that compatibility with size restraints, sadly.
fwiw, it works fine with the Pixel's built-in QR code scanner. It recognises it as text, not a URL, but it can copy to clipboard and then pasting in the browser works. Obviously I then die immediately because none of the controls work, but you can't have everything.
Hey just wanted to update, crazy timing but I Managed to add kind of some mobile touch support here because of a recent PR to FURTHER optimize it (crazy), so you can actually play it now if you figure out the controls lol
You mean the game doesn't work on mobile at all?
What kind of device do you use to scan the QR code, then?
You do not need to scan a QR code via a physical camera in your hand directly; any general purpose computer can run a QR code parsing program which accepts arbitrary images as input. It's so easy to do that there exist web pages which implement said QR code scanning in JS. Thus, the parent poster has recommended that you save the QR code .png file to your disk and then use such a piece of software, such as the website they linked, to extract the data encoded in that QR code.
That is how you can use nearly any general-purpose computer to scan a QR code.
Or... use a URL.
I'm sure the number of people who've ever scanned a QR code on a desktop computer is more than zero, but not much more.
I think I myself brought that number into early triple digits, but I do also have a hosted version if you're interested!
The reason for doing this project isn't practicality, it's because I can
Indeed! Thank you for explaining this in a way better way :)
Hey just wanted to update, I Managed to add kind of some mobile touch support here, so if you get an alternate chromium based browser, you can put in the URI to play on mobile too!
Nope it doesn't, you can use any QR code scanner that takes image input! I would've loved to include smartphone controls but that would take a LOT of extra bandwidth.
I'm kinda relieved that it doesn't work on an iPhone. I often scan codes posted around to save the time typing URLs and running arbitrary code by just scanning a QR code freaks me out.
Ironically, I actually wrote a blog about how casually we do this and how dangerous it's become lol https://kuberwastaken.github.io/blog/Technology/QR-Codes-and...
It runs inside a web browser though. This is no different from visiting an arbitrary link and running whatever arbitrary code in the Javascript sandbox of that link and one already knows a q.r. code an take one to an arbitrary link.
That said, I wouldn't mind an upgrade to the standard of say say if the link be printed above the code in human readable form in some way, the reader would refuse to open it, or at least be configurable to refuse to open it if they not match.
As far as I know the only form of code execution they support is by the URL datatype which carries the same risks as wel already mentioned anyway.
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.