Support QR code authentication

NEW
Unassigned

Status

()

Bugzilla
WebService
--
enhancement
3 years ago
3 years ago

People

(Reporter: kohei, Unassigned)

Tracking

Details

(Reporter)

Description

3 years ago
(Originally posted to https://github.com/kyoshino/bzdeck/issues/217)

Currently it is not easy to authenticate against the Bugzilla API on mobile. BzDeck and other clients would like to offer a better sign-in experience so the users can start using those apps quickly.

The advantages and disadvantages of the current authentication methods:

* Username/password: it's easy for users to remember, but 3rd party apps should not ask their credentials and it may not work with Persona users
* API Key: secure, but too long to type (40 characters), and copy-pasting is also difficult on mobile
* Token: it's easy for users to type (10 characters), but finding it from desktop browser's Cookies Manager is difficult

As I mentioned on IRC, QR code authentication might be much more user-friendly on mobile. I know LINE has such a [QR code login ability](http://help.line.me/line/win/categoryId/10000371/pc?lang=en) and there is a [QR code scanner for Firefox OS](http://youtu.be/6GR1vPijrnE) as well.

The advantages of this QR code solution:

* No typing nor copy-pasting is required on mobile 
* It balances security and usability
* The implementation is not so difficult both on the server side (Bugzilla) and the client side (BzDeck etc.) because it's based on the current API key authentication and JavaScript libraries are available

The disadvantages:

* The mobile browser support of [navigator.getUserMedia](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/getUserMedia) is limited to Firefox for Android, Firefox OS and Opera
* QR code may not be recognized depending on the camera's spec
* A desktop browser is required

How it (probably) works:

1. User opens Bugzilla's API Key page on a desktop browser
2. Bugzilla generates and shows the QR-encoded username+key
3. User launches BzDeck on mobile and scans the QR code using the camera
4. Client decodes it and authenticates against the Bugzilla API with the decoded username+key
5. Bugzilla returns a successful response if the username+key combination is valid
6. Client stores the key locally and use it when needed
i like this.

we'd want to use GD::Barcode::QRcode to generate the qrcode (it seems to have better availability on repositories in comparison to Imager::QRCode).
(In reply to Byron Jones ‹:glob› from comment #1)
> i like this.
> 
> we'd want to use GD::Barcode::QRcode to generate the qrcode (it seems to
> have better availability on repositories in comparison to Imager::QRCode).

Do we need to generate the qrcode server-side?
(In reply to Dylan William Hardison [:dylan] from comment #2)
> Do we need to generate the qrcode server-side?

good point; probably not :)

Comment 4

3 years ago
http://davidshimjs.github.io/qrcodejs/ looks like a good choice.

How would we want to display this?  I don't think we want to generate them automatically, so a user should have to click on it first.  Display it below the table, maybe?  That might be inconvenient if a user has a lot of keys, though... in a float to the right of the table?  Or an overlay maybe?
(In reply to Mark Côté [:mcote] from comment #4)
> http://davidshimjs.github.io/qrcodejs/ looks like a good choice.
> 
> How would we want to display this?  I don't think we want to generate them
> automatically, so a user should have to click on it first.  Display it below
> the table, maybe?  That might be inconvenient if a user has a lot of keys,
> though... in a float to the right of the table?  Or an overlay maybe?

yeah +1 for being on demand. Just a link in each api key row that when clicked, displays
the QR code below the API key table. I am not sure of what the restrictions are for what noise
can be around a QR code for a phones camera to pick it up properly but maybe a non-issue.

dkl
(Reporter)

Comment 6

3 years ago
Maybe a white background overlay is good for better recognition with mobile cameras.
(Reporter)

Comment 7

3 years ago
Some may already know but I have just implemented QR code auth support in my BzDeck app. Once the user has signed in on desktop, his/her valid API key is cached, so the app can show the QR code itself :)

https://github.com/bzdeck/bzdeck/commit/f4b25aa

My Flame phone and Galaxy Tab worked, but Galaxy S2 could't get a sharp capture so that QR decoding failed. I'll try to change some params of getUserMedia...

https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia
You need to log in before you can comment on or make changes to this bug.