Update OAuth2-Backend-Approach.md

This commit is contained in:
Ste Vaidis 2025-01-07 16:54:27 +02:00
parent 4457e53ff1
commit 2df04f4cde

View File

@ -39,6 +39,11 @@ A way for the `user` to tell `google` to give an access to `myapp` app
# 1. Get Code
1. Frontend **GET** to Google `https://accounts.google.com/o/oauth2` with callback url
@ -70,6 +75,11 @@ Content-Length: 0
# 2. Exchange Code with Token
1. Backend **POST** the `code` to Google `https://oauth2.googleapis.com/token`
@ -92,24 +102,24 @@ redirect_uri=https://myapp/callback
### 2. Google **response** to Backend
```json
```js
{
"access_token": "ya29.a0AfH6SMC8Op6zXZkHi2XITkDoOVzYXt3hTY6sny54UlWlxrnKlX5Xv78is7BEHekVX-VoA",
"access_token": "ya29.a0AfH6SMC8Op6zkVX-VoA",
"token_type": "Bearer",
"expires_in": 3600,
"refresh_token": "1//04d5XHqmn6Hdy3wTf5OYDP1SyBa74zEFURjddQ2A1cFw78PY13pQyWhlD2A6XhDQtKlrjAqU4kS3vGdMvckw",
"refresh_token": "1//04d5lrjAqU4kS3vGdMvckw",
"scope": "email profile"
}
```
### 3. Backend **response** to Frontend (for the initial request to Google)
### 3. Backend **Redirect** to Frontend success page
```json
{
"access_token": "ya29.a0AfH6SMC8Op6zXZkHi2XITkDoOVzYXt3hTY6sny54UlWlxrnKlX5Xv78is7BEHekVX-VoA",
"token_type": "Bearer",
"expires_in": 3600,
}
This redirect will place a cookie in the browser that contains the access token
```bash
HTTP/1.1 302 Found
Location: http://localhost:3000/dashboard
Set-Cookie: access_token=ya29.a0AfH6SMC8Op6zkVX-VoA; HttpOnly; Secure; Max-Age=3600; Path=/;
```
<details>
@ -178,13 +188,19 @@ app.get('/callback', async (req, res) => {
# 3. Use Token
### 1. Frontend **GET** profile data from Backend
```bash
curl -X GET https://myapp/api/auth/profile \
-H "Cookie: access_token=ya29.a0AfH6SMC8Op6zXZkHi2XITkDoOVzYXt3hTY6sny54UlWlxrnKlX5Xv78is7BEHekVX-VoA" \
-H "Cookie: access_token=ya29.a0AfH6SMC8Op6zkVX-VoA" \
-H "Accept: application/json"
```
@ -277,64 +293,3 @@ const App = () => {
export default App;
```
-------------------------
```bash
GET https://myapp/api/user-profile
Authorization: Bearer access-token-from-backend
```
```json
{
"sub": "1234567890",
"name": "John Doe",
"given_name": "John",
"family_name": "Doe",
"profile": "https://plus.google.com/1234567890",
"picture": "https://lh3.googleusercontent.com/a-/AOh14GgIXXl5JXzW0c1Szbl-e1Jch1vhl5rHhH65vlK6J5g5PqkGjj1O0p3t8bgVEOykQ6ykFSQ=s96",
"email": "john.doe@example.com",
"email_verified": true,
"locale": "en"
}
```
```sh
GET https://www.googleapis.com/oauth2/v3/userinfo
Authorization: Bearer ya29.a0AfH6SMC8Op6zXZkHi2XITkDoOVzYXt3hTY6sny54UlWlxrnKlX5Xv78is7BEHekVX-VoA
```
```json
{
"sub": "1234567890",
"name": "John Doe",
"given_name": "John",
"family_name": "Doe",
"profile": "https://plus.google.com/1234567890",
"picture": "https://lh3.googleusercontent.com/a-/AOh14GgIXXl5JXzW0c1Szbl-e1Jch1vhl5rHhH65vlK6J5g5PqkGjj1O0p3t8bgVEOykQ6ykFSQ=s96",
"email": "john.doe@example.com",
"email_verified": true,
"locale": "en"
}
```
```json
{
"access_token": "ya29.a0AfH6SMC8Op6zXZkHi2XITkDoOVzYXt3hTY6sny54UlWlxrnKlX5Xv78is7BEHekVX-VoA",
"token_type": "Bearer",
"expires_in": 3600
}
```