Implementing login with QR code

I am trying to implement logging into a device (a web browser for example) by scanning a QR code using your already logged in mobile device. The login flow for a typical end user would be the following:

  1. Log into your phone
  2. Start logging into a computer, it shows you a QR code.
  3. Scan the QR code with your phone
  4. The computer is automatically logged in.

WhatsApp Web for example works exactly like this.

I have done some research of how to accomplish this using Keycloak, and this is what I’ve discovered so far:

  • At the time of writing, I’ve found no public libraries, blog posts, or documentation that help with the technical implementation details.
  • I’ve found some mentions and similar implementations of QR login functionality (I would list them but new users can only put 2 links in a post)
  • I’ve found a few possible implementation strategies to accomplish this, which I will list below.

Ideas

  • The OIDC Device Flow seems to be very relevant.
    • Can this be implemented in Keycloak?
    • I see no way of enabling it by default, but perhaps it is possible to configure as an Authentication Flow?
  • You could potentially implement it as a Keycloak Extension / Custom Authenticator, though this is more hands on than I’d prefer.
  • You could somehow implement this manually using the API of existing flows, perhaps using Direct Grant or some more permissive flow
    • This could be an ugly hack, what are the pitfalls?

I would greatly appreciate any input as to what to do and not to do. Links to relevant articles and other information would also help.

Best regards

4 Likes

Hey alcesleo,

have you found out something more?
I’d also like to have this solution, my use case is a public touch display with read only access by default. But when someone wants to make a change he should be able to authorize without typing on a giant touch screen.

Best wishes,
Adrian