0

Like when we try to login on WhatsApp web, we need to scan a QR Code that showing on a browser using our phone.

How is it work actually..?

I also want to make it using Flask application, so far I found this nicely package called Flask-QRcode.

I have try several experiments on that package, and try to scan the QR Code result with a few free apps that I download on PlayStore, and yea... I got the correct result on my phone corresponding with my code that I set before.

But now, what I want are: when I scan the QR Code using my phone, I want to make any effect on my web browser, it like WhatsApp web do when we first try to login.

Is it possible to make like that with Flask..? If so, please refer any tutorial, source, or example code to do that.

Tri
  • 2,722
  • 5
  • 36
  • 65
  • 1
    Does this answer your question? [Mechanism behind QR code scanning of whatsapp webapp](https://stackoverflow.com/questions/37350286/mechanism-behind-qr-code-scanning-of-whatsapp-webapp) – Mahdi Hesari Feb 06 '21 at 15:54

1 Answers1

1

It's something along the lines of this workflow:

  1. Sign in to the website using your browser
  2. Request a token to log in this is presented as a QR Code, there are some criteria for the token:
    • it should be large to reduce the chance of it being guessed (eg 256bit).
    • it must be unique
    • it needs to be associated with the current user.
    • include an expiry time.
  3. Your mobile application decodes the QR Code and provides that to your website in lieu of a username and password.
    • The token must not have expired
    • The token is then invalidated so it cannot be used again

It is unlikely that there is an off the shelf package that will implement this flow for you. You will likely need to implement this yourself and tweak various aspects to suit your applications particular security requirements. At a minimum, all interactions MUST be via HTTPS.

I would extend the design by providing a signed login URL via the QR code rather than just a token, this provides an extra layer of protection to prevent tampering.

Tim
  • 2,510
  • 1
  • 22
  • 26
  • This is still unclear, consider the app takes the token and send it to the webserver plus his username and password. the server validates the credentials and it's ok. what happens next? – Mahdi Hesari Feb 06 '21 at 15:45
  • I found this which is the answer: https://stackoverflow.com/questions/37350286/mechanism-behind-qr-code-scanning-of-whatsapp-webapp – Mahdi Hesari Feb 06 '21 at 15:54
  • The referenced answer is doing exactly as explained in my answer. The key point here is the content of the QR code is unique and verifiable as untampered, the content can then be used in place of a username/password. – Tim Feb 07 '21 at 02:09