Update OAuth2-Front-Approach.md

This commit is contained in:
Ste Vaidis 2024-12-15 18:45:47 +02:00
parent 8fd6160666
commit 866d8daf24

View File

@ -39,6 +39,8 @@ A way for the `user` to tell `google` to give an access token to `xorismesiti.gr
### Frontend ⇢ Google ⇢ Frontend
<br>
1. A button "Login with Google" redirects the user to the Google's authorization endpoint `accounts.google.com/o/oauth2/v2/auth`
2. After the redirection, the user will log in to Google and grant permissions (if they havent already).
3. Google will redirect the user back to your redirect_uri `https://xorismesiti.gr/callback` with an authorization code `?code=`
@ -106,6 +108,8 @@ const loginWithGoogle = () => {
### Frontend ⇢ Backend ⇢ Google ⇢ Backend ⇢ Frontend
<br>
#### 2.1 Frontend
Now that the frontend has the Authorization `code` on th callback url https://xorismesiti.gr/api/auth/callback`?code=AAAABCX4XfWgyVyziyLg0QHHHHH` it can send it to the backend with POST to `xorismesiti.gr/api/auth/exchange-token`
@ -305,6 +309,8 @@ The frontend gets the tokens from the backend response, and saves them somewhere
### Frontend ⇢ Google ⇢ Frontend
<br>
1. The frontend receives the tokens from the Backend response,
2. Store them in the localStorage of the browser
3. Make authenticated requests directly to Google API
@ -383,6 +389,8 @@ const fetchUserData = async (accessToken) => {
### Frontend ⇢ Backend ⇢ Google ⇢ Backend ⇢ Frontend
<br>
If the access token is expired, the frontend will receive an error response from Google when attempting to fetch user data
<details>