amlan-roy / resume-craft

Resume Craft: Your go-to platform for effortlessly tailoring ATS-friendly resumes to job descriptions. Streamline your job application process and stand out in the competitive market.
https://resume-craft-ten.vercel.app
7 stars 3 forks source link

Setup Google Authentication and Authorization #54

Closed amlan-roy closed 7 months ago

amlan-roy commented 7 months ago

Is your feature request related to a problem? Please describe.

We need to setup user authentication and authorization using Google's identity services.

Why?

Because we need to send the authorization token and our App Script's client secret along with our post/get request to the app script backend.

Describe the solution you'd like

As far as I know, we need to follow this flow for oauth 2.0 image

Are you willing to contribute to this issue?

Yes

Additional context

Some doc links I think might be useful: https://developers.google.com/identity/gsi/web/guides/overview

amlan-roy commented 7 months ago

Tried adding <script src="https://accounts.google.com/gsi/client" async></script> and the divs

<div
  id="g_id_onload"
  data-client_id="CLIENT_ID"
  data-context="use"
  data-ux_mode="popup"
  data-itp_support="true"
  data-auto_prompt
  data-cancel_on_tap_outside
></div>

<div
  className="g_id_signin"
  data-type="standard"
  data-shape="pill"
  data-theme="filled_black"
  data-text="signin_with"
  data-size="small"
  data-logo_alignment="left"
></div>

Used react-helmet (npm i react-helmet and npm i "@types/react-helmet" -dev) for injecting script tag in react

<Helmet> <script>...</script> </Helmet>

Login works, but it is not persisting. It is also probably not storing the token. Need to figure it out.

amlan-roy commented 7 months ago

We can use @react-oauth/google for both authentication and authorization. Can refer https://github.com/amlan-roy/resume-craft/pull/55 for more details (Thanks to @iZooGooD).

Tried implementing the basic flow to get the authorization token, and currently facing issue when passing restricted scopes (https://www.googleapis.com/auth/drive and https://www.googleapis.com/auth/drive.currentonly) during the auth request. Getting the authorization code for the remaining scopes successfully.

There might be some issue with the google console project. Will need to figure that out.

Also will need to figure out a way to store this code (and the refesh token), refetch and update this authorization code with the help of refresh token, and will need to ask for the required permissions when generating the resume. Note that we dont need to ask for the permission every time, but only till we get the required permissions.