QR scanner Feature

[shreya-mishra]

Currently, users have to manually enter their GitHub credentials in the mobile app to sign in.

Signup with GitHub should redirect to the web browser and ask for the login details and then redirect back to our Mobile app
#142

This can be a tedious process because a lot of people didn't sign into GitHub on the mobile app. To make the sign-in process smoother and more efficient, we propose the implementation of QR code scanning for sign-in in the mobile app.

With this feature, users will be able to scan a QR code from the my-site website using their mobile camera, which will automatically fill in their login credentials in the mobile app provided that they should be logged in to my-site, making the sign-in process much easier and faster. This will improve the overall user experience and increase user engagement with our app.

Implementation of this feature will require updates to the mobile app, the website, and the backend. We will need to develop a QR code generator for the website, as well as a QR code scanner for the mobile app. The scanner will need to be able to decode the QR code and extract the user's login credentials securely.

We believe that this feature will be highly beneficial for our users and will set our app apart from competitors. We look forward to working on this feature and improving the user experience of our app.

STEPS:

- [ ] Real-Dev-Squad/website-backend#940

• Feature Request: Integrate QR code library  website-my#367 - (changes will show user-ID as a QR code)
• Implement a Scanner that can scan QR codes  #152
• Feature Request: POST Request to create a qr-code-auth document website-backend#941
• Integrate the POST call  #153
• Feature Request : PATCH request that updates the authorization_status field of an existing qr-code-auth document for the specified user. website-backend#942
• Implement a POST API call which will take confirmation from the my-site website-backend#1012
• Feature Request : Make a button below the QR code  website-my#368
• Feature Request : Integrate the PATCH Api call on button click  website-my#369
• Feature Request : Retrieving QR-Code-Auth Document website-backend#1011
• Create "Status" Button for Mobile App and Implement Get API Call to Retrieve Token and User Info #157

[sakshambhatt]

@shreya-mishra please check the above diagram

[sakshambhatt]

Hello @shreya-mishra , I was scoping the task down. I wanted to ask the following things for clarification.

1. Where will I get the code for signIn in the website?
2. Which API do I need to call after the user has pasted their code?

[shreya-mishra]

Hello @shreya-mishra , I was scoping the task down. I wanted to ask the following things for clarification.

1. Where will I get the code for signIn in the website?
2. Which API do I need to call after the user has pasted their code?

1. We will get the code on the RDS home page
2. We haven't made any api for that

• Is @ankushdharkar confirmed the above flow ?

[RitikJaiswal75]

How do we get code? And how is it linked to a specific user?

[shreya-mishra]

We have some changes in this scenario, at first, we were getting the code from the website and pasting it on the mobile app signIn screen but now the user will be on our mobile app and they will click on sign in with the RDS site they will be redirected to the page where the text will be shown ie; go to my site and then they will write the same code manually on the website from the mobile app and if the time-based code match then they will redirect to the homepage of the mobile app.

[shreya-mishra]

How do we get code? And how is it linked to a specific user?

• where do we get the code - backend
• unique ACC id

[shreya-mishra]

@sakshambhatt , will you please start working on the above issue, start with random OTP generation on the mobile app after clicking on sign in with the RDS site button, and below the text should be visible ( go to my site and paste the above code).

[sakshambhatt]

Yes, I will start on this today.

[sakshambhatt]

New flow for sign in with QR code:

1. User signs-in in mobile app
2. Generate public and private key for the user. Send public key to backend. Store private key of the user in Secure Storage in mobile.
3. User opens my site, where backend sends a token, which will shown in the form of a QR code. [Refresh on interval]
4. User scans QR code with their mobile app -> which signs the token of QR with their private key using a good digital signature algo, and sends the signed message to backend
5. Backend uses the public key of the user from whom the signed message came, and use that user's public key to verify that the signature was generated using that user's private key or not, without an iota of a doubt.
6. If verification is successful then generate an accessToken for that user and send it to the client having the token of QR

[sakshambhatt]

Few more points to consider:

1. We can use a common pair of public/ private keys
2. We can forego the use public/ private keys entirely and just send the token of QR with the access token. As there is no additional need for this. The user already has gone through a complex flow to acquire their access token.

Will try out and make 2 PoCs for 2nd one and then 1st one.

[iamitprakash]

@shreya-mishra @sahsisunny please update design and schedule call for discussion

[shreya-mishra]

@shreya-mishra @sahsisunny please update design and schedule call for discussion

will do it by 13th!