asyavee/medusa-store
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

docs: fix callback validation for third-party authentication (#14109)

Browse Source 
* docs: fix callback validation for third-party authentication

* address comment
This commit is contained in:
Shahed Nasser
2025-11-24 15:43:05 +02:00
committed by GitHub
parent b81f958d41
commit 22ca22a2f0
11 changed files with 272 additions and 166 deletions
Download Patch File Download Diff File Expand all files Collapse all files
www/apps/resources/app/commerce-modules/auth/authentication-route/page.mdx
+12
View File
@@ -256,6 +256,18 @@ In your frontend, decode the token using tools like [react-jwt](https://www.npmj
- If the decoded data has an `actor_id` property, the user is already registered. So, use this token for subsequent authenticated requests.
- If not, use the token in the header of a request that creates the user, such as the [Create Customer API route](!api!/store#customers_postcustomers).
The decoded data may look like this:
```json
{
"actor_id": "", // Empty if the user is not registered
"user_metadata": {
"email": "Whitney_Schultz@gmail.com"
}
// other fields...
}
```
---
## Refresh Token Route
www/apps/resources/app/storefront-development/customers/third-party-login/page.mdx
+9 -47
View File
@@ -355,15 +355,12 @@ Finally, you'll add to the page a function that validates the authentication cal
Add in the place of the new `TODO` the `validateCallback` function that runs when the page first loads to validate the authentication:
<CodeTabs group="authenticated-request">
<CodeTab label="React" value="react">
export const validateReactHighlights = [
["2", "sendCallback", "Validate the callback in Medusa and retrieve the authentication token"],
["4", "shouldCreateCustomer", "Check if the decoded token has an `actor_id` property to decide whether a customer needs to be created"],
["7", "createCustomer", "Create a customer if the decoded token doesn't have `actor_id`"],
["9", "refreshToken", "Fetch a new token for the created customer"],
["13", "retrieve", "Retrieve the customer's details as an example of testing authentication"]
["6", "shouldCreateCustomer", "Check if the decoded token has an `actor_id` property to decide whether a customer needs to be created"],
["9", "createCustomer", "Create a customer if the decoded token doesn't have `actor_id`"],
["11", "refreshToken", "Fetch a new token for the created customer"],
["15", "retrieve", "Retrieve the customer's details as an example of testing authentication"]
]
```tsx highlights={validateReactHighlights}
@@ -387,46 +384,9 @@ const validateCallback = async () => {
setLoading(false)
}
// TODO run validateCallback when the page loads
```
</CodeTab>
<CodeTab label="JS SDK" value="js-sdk">
export const validateFetchHighlights = [
["2", "sendCallback", "Validate the callback in Medusa and retrieve the authentication token"],
["4", "shouldCreateCustomer", "Check if the decoded token has an `actor_id` property to decide whether a customer needs to be created"],
["7", "createCustomer", "Create a customer if the decoded token doesn't have `actor_id`"],
["9", "refreshToken", "Fetch a new token for the created customer"],
["13", "retrieve", "Retrieve the customer's details as an example of testing authentication"]
]
```ts highlights={validateFetchHighlights}
const validateCallback = async () => {
const token = await sendCallback()
const shouldCreateCustomer = (decodeToken(token) as { actor_id: string }).actor_id === ""
if (shouldCreateCustomer) {
await createCustomer()
await refreshToken()
}
// use token to send authenticated requests
const { customer: customerData } = await sdk.store.customer.retrieve()
setCustomer(customerData)
setLoading(false)
}
// TODO run validateCallback when the page loads
```
</CodeTab>
</CodeTabs>
The `validateCallback` function uses the functions added earlier to implement the following flow:
1. Send a request to the [Validate Callback API route](!api!/store#auth_postactor_typeauth_providercallback). This returns an authentication token.
@@ -527,15 +487,17 @@ export default function GoogleCallback() {
const validateCallback = async () => {
const token = await sendCallback()
const shouldCreateCustomer = (decodeToken(token) as { actor_id: string }).actor_id === ""
const decodedToken = decodeToken(token) as { actor_id: string, user_metadata: Record<string, unknown> }
const shouldCreateCustomer = decodedToken.actor_id === ""
if (shouldCreateCustomer) {
await createCustomer()
await createCustomer(decodedToken.user_metadata.email as string)
await refreshToken()
}
// all subsequent requests are authenticated
// use token to send authenticated requests
const { customer: customerData } = await sdk.store.customer.retrieve()
setCustomer(customerData)