Update OAuth2-Front-Approach.md

This commit is contained in:
Ste Vaidis 2024-12-15 19:32:05 +02:00
parent 7b04f99181
commit 4a19830f6c

View File

@ -403,16 +403,20 @@ const fetchUserData = async (accessToken) => {
<br><br><br> <br><br><br>
# 5. Refresh the Token # 5. Refresh the Token
### Frontend ⇢ Backend ⇢ Google ⇢ Backend ⇢ Frontend ### Frontend ⇢ Backend ⇢ Google ⇢ Backend ⇢ Frontend
<br> <br>
If the access token is expired, the frontend will receive an error response from Google when attempting to fetch user data If the access token is expired, the frontend will receive a response error from Google when attempting to fetch user data
<details> <details>
<summary><h4>HTTP GET Request from Frontend to Google</h4></summary> <summary><h4>HTTP GET Request from Frontend to Google (with expires token)</h4></summary>
```bash ```bash
GET https://www.googleapis.com/oauth2/v3/userinfo GET https://www.googleapis.com/oauth2/v3/userinfo
@ -435,14 +439,47 @@ Authorization: Bearer ACCESSTOKEN6zXZkHi2XITkDoOVACCESSTOKEN
<details> <details>
<summary><h4>HTTP POST Refresh token from Frontend to Backend</h4></summary> <summary><h4>HTTP POST Request from Frontend to Backend (with refresh token)</h4></summary>
```bash ```bash
POST /api/refresh-token HTTP/1.1
Host: your-backend-domain.com
Content-Type: application/json
Authorization: Bearer <access_token> (optional, depends on the backend)
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36
Accept: application/json
Origin: https://your-frontend-domain.com
Connection: keep-alive
Content-Length: 57
{
"refresh_token": "REFRESHTOKEN6zXZkHi2XITkDoOVREFRESHTOKEN"
}
``` ```
</details> </details>
<details>
<summary><h4>HTTP POST Response from Backend to Frontend (with new access token)</h4></summary>
```json
HTTP/1.1 200 OK
Content-Type: application/json
Content-Length: 123
Cache-Control: no-store
Pragma: no-cache
{
"access_token": "new-access-token-here",
"expires_in": 3600,
"token_type": "bearer"
}
```
</details>
<details> <details>
<summary><h4>Frontend Code</h4></summary> <summary><h4>Frontend Code</h4></summary>