Monday, March 30, 2015

New Firefox Add-On: QRCode Login

Current login mechanisms suffer from missing support by browsers and sites.
Browsers offer in-browser password storage but that's about that.
Standardized authentication methods like HTTP Digest Authentication and HTTP Basic Authentication were never really accepted by commercially successful sites. They work but the user experience is bad especially if the user does not have an account yet.

So most sites are left with form-based authentication were the site has full control over the UI and UX. Sadly the browser has little to offer here to help the site or the user other then trying to identify signup and login forms through crude guesses based on password field existence.

There is no standardized way for sites and browsers to work together.
Here is a list of attempts to solve some of the above issues:

Federations have their drawbacks too. Even Facebook login went dark for 4h a while ago which left sites depending on Facebook without user login.

In general there is this chicken-egg problem:
Why should sites support new-mechanism-foo when there is no browser support.
Why should browsers support new-mechanism-foo when there are no sites using it.

Then there are password stores. I use passwordsafe to store my password in one place. If I do not have access to that place (PC) then I can't login. Bummer.
Others use stores hosted on the Internet and those usually support most browsers and OSses through plugin/addons and non standard trickery.
I never could convince myself to trust the providers.

So. Drum-roll.
I started to work on a mechanism that has a password store on the mobile which allows you to login on your PC using your PC's camera.

The user story is as follows:
  1. browse to a site's login page e.g. https://github.com/login
  2. have my Firefox addon installed
    https://github.com/AxelNennker/qrcodelogin
  3. click on the addon's icon
  4. present your credential-qrcode to the PC's camera
  5. be logged in
Here is an example qrcode containing the credentials as a JSON array
["axel@nennker.de","password"]:

The qrcode could be printed on paper or generated by your password store on your mobile. To help the user with the selection of the matching credentials the addon presents a request-qrcode to be read by the mobile first. This way the mobile ID-client can select the matching credentials.
(If you don't like to install addons to test this and for a super quick demo of the qrcode reading using your webcam please to to http://axel.nennker.de/gum.html and scan a code)

What are the benefits?
  • no need to change the site's javascript, html markup or https headers. No changes whatsoever needed on the accepting site.
  • no need to have an extra backend server to store your credentials.
  • no need to have an extra backend server to help mobile and browser to communicate.
  • no need for an enhanced browser or client. no need for the browser to know about new markup, new javascript APIs or HTTP headers.
What are the drawbacks?
  • reading the qrcode from the mobile's screen very much depends on the light and camera. Printed credentials work reliably but qrcode on mobile screens sometime give me headaches.
  • You have to install the addon.
  • This is an alpha version. Your mileage may vary.

Screenshots:

Login page at githup with addon installed:


Screen after pressing the addon's toolbar icon. The qrcode helps the mobile ID-client to find the matching credentials:
Screen showing the camera picture which is scanned for qrcodes:
This is clearly only a first step but I believe that it has potential to be a true user-centric solution that helps me and you to handle the password mess.









1 comment:

Anders Rundgren said...

QR Login is great!

I did something similar but much more intrusive in:
https://play.google.com/store/apps/details?id=org.webpki.mobile.android