Hi!
Do you know if I can log a user in using a generated QR code? The user would use the code on a desktop based device to take him to a log in page on the phone, and after logging in on the phone, the app on the desktop would become logged in.
(My app will run on a ‘browser’ that can’t accept keyboard input).
Yes, possible, yes I’ve done it. Use a QR generator plugin. Use Bubbles magic link feature. QR generator will use the magic link url.
Thanks, this sounds promising 
I’ll give it a go.
Could you please explain further? I don’t understand how this allows the non-keyboard device to log in. The user can log in using the normal method on the phone, via the QR code, but this doesn’t link the two devices. And the magic log in link needs an email, which can’t be known because the can’t type and of course there is no current user…
Does this non-keyboard device have a mouse? Or you can’t interact with it at all?
Actually, mine is a silly question maybe. If you can’t interact, how do you open your application URL Maybe talk about this device more.
It has a mouse, yes. And technically a keyboard too, but this can’t be used since the ‘browser’ is an HTML window within a game, and the keyboard inputs get sent to both the HTML window and the game, causing all sorts of problems. The window is opened and closed via a mouse action.
So you need a single screen or you can click around and browse to other pages of your app?. And thia device has scan qr code functionality?
This browser window runs on a normal PC, and a phone would be used for the QR code. The game’s browser window lets you click around as much as you want, with the mouse as the only input.
I’ve seen other apps running in this PC game’s window use links that open the default browser on the PC for logging in, but I don’t know how they connect the two browsers to share the login state.
I’ve also seen other apps use QR codes, for logging in via the phone, but again linking the login state has to somehow be passed on to the original browser.
Ok one last question and I have a solution.
Can this device scan QR codes from your phone, extract the magical link in the QR code and open this link? If it can, it is pretty straight forward.
No, it’s the other way around: the desktop PC is the thing needing to be logged in without a keyboard. The phone would be the device scanning the QR code.
Ok, assuming this device can only show a fixed URL in a browser, here is how you can authenticate this device without any keyboard interaction.
The key here is the magic link. Otherwise, none of these would work 
(*actually it would, see the footnote)
First the demo. In this demo, the browser on the left is this device with no keyboard interaction. And the browser on the right is your phone or your laptop that you can use to login. Technically, you can scan the code on the device to open the browser as well automatically.
What’s happening is this:
Here are some technical details.
I have a login code data type with just a code (text) and login link (text).
When the main page is displayed, it creates a login code automatically. Code is just random and login link is empty. And set the state of the page with this newly created code.
The main page is just displaying the QR code and the info related to this code. But it is simply the login URL with the code in your app.
Then, when someone scans the code or enters that page manually. Approve button creates a magic link for the user and attach it to this code as Login Link:
Then the main page just refreshes itself and use the login link in the code it displays and authenticate the user:
The page displayed after authentication is set in the magic link action:
And here is the editor if you want to see it in more details. I keep these forum tests around as long as Bubble lets me.
*Without magic link: You would have to put your name and password to code’s related fields instead of the magic link. Which is totally unsafe
Firstly, this works just as I needed. Secondly, thank you so much! Very clear instructions and a demo to boot. I couldn’t have figured this out myself.
I modified the approval page so that the log in and approval are done at the same time, and the code isn’t displayed.
You may want to clear the code table sometimes (or right after the authentication) to keep it clean.
Yes, it’s in the to do list
This topic was automatically closed after 70 days. New replies are no longer allowed.
