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

Update OAuth2-Front-Approach.md

Browse Source
This commit is contained in:
Ste Vaidis 2024-12-15 18:50:20 +02:00
parent 38a747d044
commit 393a22345d
1 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
OAuth2-Front-Approach.md
View File

@ -50,7 +50,7 @@ A way for the `user` to tell `google` to give an access token to `xorismesiti.gr
<br>
<details>
<summary><h3>Frontend HTTP GET Request to Google</h3></summary>
<summary><h3>HTTP GET Request from Frontend to Google</h3></summary>
```sh
GET https://accounts.google.com/o/oauth2/v2/auth?
@ -70,7 +70,7 @@ GET https://accounts.google.com/o/oauth2/v2/auth?
</details>
<details>
<summary><h3>Google HTTP Response to Frontend </h3></summary>
<summary><h3>HTTP GET Response from Google to Frontend </h3></summary>
```bash
HTTP/1.1 302 Found
@ -117,7 +117,7 @@ const loginWithGoogle = () => {
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`
<details>
<summary><h3>Frontend HTTP POST Request to Backend</h3></summary>
<summary><h3>HTTP POST Request from Frontend to Backend</h3></summary>
```bash
POST https://xorismesiti.gr/api/auth/exchange-token
@ -144,7 +144,7 @@ Content-Type: application/json
*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>
<summary><h3>HTTP POST Request from Backend to Google</h3></summary>
```sh
POST https://oauth2.googleapis.com/token
@ -171,7 +171,7 @@ client_secret=PASS1234
</details>
<details>
<summary><h3>Google HTTP Response Backend</h3></summary>
<summary><h3>HTTP POST Response from Google to Backend</h3></summary>
```json
{
@ -288,7 +288,7 @@ export default Callback;
The frontend gets the tokens from the backend response, and saves them somewhere secure. Now its ready to use the tokens to get the user data from Google
<details>
<summary><h3>Backend HTTP Response to Frontend</h3></summary>
<summary><h3>HTTP Response from Backend to Frontend</h3></summary>
```json
{
@ -318,7 +318,7 @@ The frontend gets the tokens from the backend response, and saves them somewhere
3. Make authenticated requests directly to Google API
<details>
<summary><h3>Frontend HTTP GET Request to Backend</h3></summary>
<summary><h3>HTTP GET Request from Frontend to Backend</h3></summary>
```bash
GET https://www.googleapis.com/oauth2/v3/userinfo
@ -328,7 +328,7 @@ Authorization: Bearer ACCESSTOKEN6zXZkHi2XITkDoOVACCESSTOKEN
</details>
<details>
<summary><h3>Backedn HTTP Response to Frontend</h3></summary>
<summary><h3>HTTP GET Response from Backend to Frontend</h3></summary>
```json
{
@ -396,7 +396,7 @@ const fetchUserData = async (accessToken) => {
If the access token is expired, the frontend will receive an error response from Google when attempting to fetch user data
<details>
<summary><h3>Frontend HTTP GET Request to Google</h3></summary>
<summary><h3>HTTP GET Request from Frontend to Google</h3></summary>
```bash
GET https://www.googleapis.com/oauth2/v3/userinfo
@ -406,7 +406,7 @@ Authorization: Bearer ACCESSTOKEN6zXZkHi2XITkDoOVACCESSTOKEN
</details>
<details>
<summary><h3>Google HTTP Response to Frontend</h3></summary>
<summary><h3>HTTP GET Response from Google to Frontend</h3></summary>
```json
{
@ -419,7 +419,7 @@ Authorization: Bearer ACCESSTOKEN6zXZkHi2XITkDoOVACCESSTOKEN
<details>
<summary><h3>Frontend HTTP POST Refresh token to Backend</h3></summary>
<summary><h3>HTTP POST Refresh token from Frontend to Backend</h3></summary>
```bash