stevaidis/dev
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Update OAuth2.md

Browse Source
This commit is contained in:
Ste Vaidis 2024-12-15 14:39:52 +02:00
parent d2cd1ba068
commit 49c05063b2
1 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
OAuth2.md
View File

@ -37,7 +37,7 @@ A way for the `user` to tell `google` to give an access token to `xorismesiti.gr
# 1. [Frontend] Request Authorization code
1. A link button "Login with Google" redirects the user to the Google's OAuth 2.0 authorization endpoint.
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 haven’t already).
3. Google will redirect the user back to your redirect_uri `https://xorismesiti.gr/callback` with an authorization code `?code=`
@ -100,10 +100,7 @@ const loginWithGoogle = () => {
# 2. [Frontend] Receive Authorization Code
1. User grants permission
2. Google redirect the user to the `redirect_uri` you specified in the previous request (`https://xorismesiti.gr/api/auth/callback`)
3. The frontend must not directly exchange the `code` for an `access_token`. Instead, it sends the `code` to the backend via an API request.
Now that the frontend have the Authorization Code `https://xorismesiti.gr/api/auth/callback?code=AAAABCX4XfWgyVyziyLg0QHHHHH` it can send it to the backend with POST to `xorismesiti.gr/api/auth/exchange-token`, in order the backend to exchange the `code` for an `access_token` and optionally an `refresh_token`
<details>
<summary><h3>Frontend HTTP POST Request to Backend</h3></summary>
@ -113,7 +110,7 @@ POST https://xorismesiti.gr/api/auth/exchange-token
Content-Type: application/json
{
"code": "authorization-code-from-google"
"code": "AAAABCX4XfWgyVyziyLg0QHHHHH"
}
```
@ -183,10 +180,12 @@ export default Callback;
# 3. [Backend] Exchange Code with Token
1. The backend receives the authorization `code` from the frontend,
2. The backend makes a `POST` request to Google token endpoint, to exchange the authorization `code` for the `access_token` and optionally a `refresh token`
3. The backend ensures to never expose the client_secret to the frontend. This step should always be handled on the backend.
4. The backend will exchange the `code` for an `access_token` and `refresh_token`, which are sent back to the frontend or stored securely for subsequent API calls.
1. The backend **receives** the `code` from the frontend (a POST on `xorismesiti.gr/api/auth/exchange-token` with the authorization `code`)
2. The backend **sends** `code` to Google (makes a `POST` request to Google token endpoint to send the authorization `code`)
3. The Google API responses to POST with tokens `access_token` and `refresh_token`
4. The backend **sends** tokens to frontend (at POST respond on `xorismesiti.gr/api/auth/exchange-token`)
*Security: The backend never expose the client_secret to the frontend. This step should always be handled on the backend.*
<details>
<summary><h3>Backend HTTP POST Request to Google</h3></summary>
@ -207,16 +206,16 @@ POST https://oauth2.googleapis.com/token
Content-Type: application/x-www-form-urlencoded
grant_type=authorization_code&
code=4/0AX4XfWgNmGZVbV7Kdr8Q9yVyzIYBnbbBdLfX39ZaE8m0w8zT8jKRLl7w-uT8k7WiyLg0Q&
code=AAAABCX4XfWgyVyziyLg0QHHHHH&
redirect_uri=https://xorismesiti.gr/callback&
client_id=YOUR_GOOGLE_CLIENT_ID&
client_secret=YOUR_GOOGLE_CLIENT_SECRET
client_id=ABC34JHS9D&
client_secret=PASS1234
```
</details>
<details>
<summary><h3>Google HTTP Response Backend and Backend response to Frontend</h3></summary>
<summary><h3>Google HTTP Response Backend</h3></summary>
```json
{