docs: document dependencies for auth provider (#10865)

* docs: document dependencies for auth provider

* fixes

* document overriding callback url
This commit is contained in:
Shahed Nasser
2025-01-07 16:42:45 +02:00
committed by GitHub
parent edcff0ed16
commit 60fd1cbc6c
9 changed files with 125 additions and 65 deletions
@@ -110,7 +110,7 @@ The third-party service authentication method requires using the `authenticate`
```ts ```ts
const { success, authIdentity, location } = await authModuleService.authenticate( const { success, authIdentity, location } = await authModuleService.authenticate(
"emailpass", "google",
// passed to auth provider // passed to auth provider
{ {
// ... // ...
@@ -134,6 +134,21 @@ For example, when using the `google` provider, the `location` is the URL that th
![Diagram showcasing the first part of the third-party authentication flow](https://res.cloudinary.com/dza7lstvk/image/upload/v1711374847/Medusa%20Resources/third-party-auth-1_enyedy.jpg) ![Diagram showcasing the first part of the third-party authentication flow](https://res.cloudinary.com/dza7lstvk/image/upload/v1711374847/Medusa%20Resources/third-party-auth-1_enyedy.jpg)
### Overriding Callback URL
The Google and GitHub providers allow you to override their `callbackUrl` option during authentication. This is useful when you redirect the user after authentication to a URL based on its actor type. For example, you redirect admin users and customers to different pages.
```ts
const { success, authIdentity, location } = await authModuleService.authenticate(
"google",
// passed to auth provider
{
// ...
callback_url: "example.com"
}
)
```
### validateCallback ### validateCallback
Providers handling this authentication flow must implement the `validateCallback` method. It implements the logic to validate the authentication with the third-party service. Providers handling this authentication flow must implement the `validateCallback` method. It implements the logic to validate the authentication with the third-party service.
@@ -19,14 +19,16 @@ The Emailpass auth provider is registered by default with the Auth Module.
If you want to pass options to the provider, add the provider to the `providers` option of the Auth Module: If you want to pass options to the provider, add the provider to the `providers` option of the Auth Module:
```ts title="medusa-config.ts" ```ts title="medusa-config.ts"
import { Modules } from "@medusajs/framework/utils" import { Modules, ContainerRegistrationKeys } from "@medusajs/framework/utils"
// ... // ...
const modules = { module.exports = defineConfig({
// ... // ...
[Modules.AUTH]: { modules: [
{
resolve: "@medusajs/medusa/auth", resolve: "@medusajs/medusa/auth",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
options: { options: {
providers: [ providers: [
// other providers... // other providers...
@@ -39,8 +41,9 @@ const modules = {
}, },
], ],
}, },
}, }
} ],
})
``` ```
### Module Options ### Module Options
@@ -36,14 +36,16 @@ Learn about the authentication flow in [this guide](../../authentication-route/p
Add the module to the array of providers passed to the Auth Module: Add the module to the array of providers passed to the Auth Module:
```ts title="medusa-config.ts" ```ts title="medusa-config.ts"
import { Modules } from "@medusajs/framework/utils" import { Modules, ContainerRegistrationKeys } from "@medusajs/framework/utils"
// ... // ...
const modules = { module.exports = defineConfig({
// ... // ...
[Modules.AUTH]: { modules: [
{
resolve: "@medusajs/medusa/auth", resolve: "@medusajs/medusa/auth",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
options: { options: {
providers: [ providers: [
// other providers... // other providers...
@@ -58,8 +60,9 @@ const modules = {
}, },
], ],
}, },
}, }
} ],
})
``` ```
### Environment Variables ### Environment Variables
@@ -141,6 +144,14 @@ GITHUB_CALLBACK_URL=<YOUR_GITHUB_CALLBACK_URL>
--- ---
## Override Callback URL During Authentication
In many cases, you may have different callback URL for actor types. For example, you may redirect admin users to a different URL than customers after authentication.
The [Authenticate or Login API Route](../../authentication-route/page.mdx#login-route) can accept a `callback_url` body parameter to override the provider's `callbackUrl` option. Learn more in [this documentation](../../authentication-route/page.mdx#login-route).
---
## Examples ## Examples
- [How to implement third-party / social login in the storefront.](../../../../storefront-development/customers/third-party-login/page.mdx). - [How to implement third-party / social login in the storefront.](../../../../storefront-development/customers/third-party-login/page.mdx).
@@ -36,14 +36,18 @@ Learn about the authentication flow for third-party providers in [this guide](..
Add the module to the array of providers passed to the Auth Module: Add the module to the array of providers passed to the Auth Module:
```ts title="medusa-config.ts" ```ts title="medusa-config.ts"
import { Modules } from "@medusajs/framework/utils" import { Modules, ContainerRegistrationKeys } from "@medusajs/framework/utils"
// ... // ...
const modules = { module.exports = defineConfig({
// ...
modules: [
{
// ... // ...
[Modules.AUTH]: { [Modules.AUTH]: {
resolve: "@medusajs/medusa/auth", resolve: "@medusajs/medusa/auth",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
options: { options: {
providers: [ providers: [
// other providers... // other providers...
@@ -59,7 +63,9 @@ const modules = {
], ],
}, },
}, },
} }
],
})
``` ```
### Environment Variables ### Environment Variables
@@ -141,6 +147,16 @@ GOOGLE_CALLBACK_URL=<YOUR_GOOGLE_CALLBACK_URL>
--- ---
---
## Override Callback URL During Authentication
In many cases, you may have different callback URL for actor types. For example, you may redirect admin users to a different URL than customers after authentication.
The [Authenticate or Login API Route](../../authentication-route/page.mdx#login-route) can accept a `callback_url` body parameter to override the provider's `callbackUrl` option. Learn more in [this documentation](../../authentication-route/page.mdx#login-route).
---
## Examples ## Examples
- [How to implement Google social login in the storefront](../../../../storefront-development/customers/third-party-login/page.mdx). - [How to implement Google social login in the storefront](../../../../storefront-development/customers/third-party-login/page.mdx).
@@ -32,9 +32,9 @@ The steps are:
2. Use the authentication token to create the user with their respective API route. 2. Use the authentication token to create the user with their respective API route.
- For example, for customers you would use the [Create Customer API route](!api!/store#customers_postcustomers). - For example, for customers you would use the [Create Customer API route](!api!/store#customers_postcustomers).
- For admin users, you accept an invite using the [Accept Invite API route](!api!/admin#invites_postinvitesaccept) - For admin users, you accept an invite using the [Accept Invite API route](!api!/admin#invites_postinvitesaccept)
3. Authenticate the user with the [Auth Route](#auth-route). 3. Authenticate the user with the [Auth Route](#login-route).
After registration, you only use the [Auth Route](#auth-route) for subsequent authentication. After registration, you only use the [Auth Route](#login-route) for subsequent authentication.
<Note> <Note>
@@ -56,7 +56,7 @@ It requires the following steps:
![Diagram showcasing the authentication flow between the frontend, Medusa application, and third-party service](https://res.cloudinary.com/dza7lstvk/image/upload/v1725528159/Medusa%20Resources/Third_Party_Auth_tvf4ng.jpg) ![Diagram showcasing the authentication flow between the frontend, Medusa application, and third-party service](https://res.cloudinary.com/dza7lstvk/image/upload/v1725528159/Medusa%20Resources/Third_Party_Auth_tvf4ng.jpg)
1. Authenticate the user with the [Auth Route](#auth-route). 1. Authenticate the user with the [Auth Route](#login-route).
2. The auth route returns a URL to authenticate with third-party service, such as login with Google. The frontend (such as a storefront), when it receives a `location` property in the response, must redirect to the returned location. 2. The auth route returns a URL to authenticate with third-party service, such as login with Google. The frontend (such as a storefront), when it receives a `location` property in the response, must redirect to the returned location.
3. Once the authentication with the third-party service finishes, it redirects back to the frontend with a `code` query parameter. So, make sure your third-party service is configured to redirect to your frontend page after successful authentication. 3. Once the authentication with the third-party service finishes, it redirects back to the frontend with a `code` query parameter. So, make sure your third-party service is configured to redirect to your frontend page after successful authentication.
4. The frontend sends a request to the [Callback Route](#callback-route) passing the `code` query parameter. 4. The frontend sends a request to the [Callback Route](#callback-route) passing the `code` query parameter.
@@ -87,7 +87,7 @@ curl -X POST http://localhost:9000/auth/{actor_type}/{providers}/register
<Note> <Note>
This API route is useful for providers like `emailpass` that uses custom logic to authenticate a user. For authentication providers that authenticate with third-party services, such as Google, use the [Auth Route](#auth-route) instead. This API route is useful for providers like `emailpass` that uses custom logic to authenticate a user. For authentication providers that authenticate with third-party services, such as Google, use the [Auth Route](#login-route) instead.
</Note> </Note>
@@ -180,6 +180,12 @@ This route accepts in the request body the data that the specified authenticatio
For example, the EmailPass provider requires an `email` and `password` fields in the request body. For example, the EmailPass provider requires an `email` and `password` fields in the request body.
#### Overriding Callback URL
For the [GitHub](../auth-providers/github/page.mdx) and [Google](../auth-providers/google/page.mdx) providers, you can pass a `callback_url` body parameter that overrides the `callbackUrl` set in the provider's configurations.
This is useful if you want to redirect the user to a different URL after authentication based on their actor type. For example, you can set different `callback_url` for admin users and customers.
### Response Fields ### Response Fields
If the authentication is successful, you'll receive a `token` field in the response body object: If the authentication is successful, you'll receive a `token` field in the response body object:
@@ -27,7 +27,7 @@ By default, the `emailpass` provider is registered to authenticate customers and
For example: For example:
```ts title="medusa-config.ts" ```ts title="medusa-config.ts"
import { Modules } from "@medusajs/framework/utils" import { Modules, ContainerRegistrationKeys } from "@medusajs/framework/utils"
// ... // ...
@@ -36,6 +36,7 @@ module.exports = defineConfig({
modules: [ modules: [
{ {
resolve: "@medusajs/medusa/auth", resolve: "@medusajs/medusa/auth",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
options: { options: {
providers: [ providers: [
{ {
+4 -4
View File
@@ -1,9 +1,9 @@
export const generatedEditDates = { export const generatedEditDates = {
"app/commerce-modules/auth/auth-providers/emailpass/page.mdx": "2024-10-08T07:35:59.167Z", "app/commerce-modules/auth/auth-providers/emailpass/page.mdx": "2025-01-07T12:47:24.380Z",
"app/commerce-modules/auth/auth-providers/page.mdx": "2024-10-08T07:27:21.859Z", "app/commerce-modules/auth/auth-providers/page.mdx": "2024-10-08T07:27:21.859Z",
"app/commerce-modules/auth/authentication-route/page.mdx": "2025-01-07T09:26:27.809Z", "app/commerce-modules/auth/authentication-route/page.mdx": "2025-01-07T09:26:27.809Z",
"app/commerce-modules/auth/examples/page.mdx": "2024-10-15T15:02:13.794Z", "app/commerce-modules/auth/examples/page.mdx": "2024-10-15T15:02:13.794Z",
"app/commerce-modules/auth/module-options/page.mdx": "2024-10-15T12:52:08.930Z", "app/commerce-modules/auth/module-options/page.mdx": "2025-01-07T12:47:35.073Z",
"app/commerce-modules/auth/page.mdx": "2024-12-25T15:40:37.154Z", "app/commerce-modules/auth/page.mdx": "2024-12-25T15:40:37.154Z",
"app/commerce-modules/cart/_events/_events-table/page.mdx": "2024-07-03T19:27:13+03:00", "app/commerce-modules/cart/_events/_events-table/page.mdx": "2024-07-03T19:27:13+03:00",
"app/commerce-modules/cart/_events/page.mdx": "2024-07-03T19:27:13+03:00", "app/commerce-modules/cart/_events/page.mdx": "2024-07-03T19:27:13+03:00",
@@ -861,8 +861,8 @@ export const generatedEditDates = {
"references/types/HttpTypes/interfaces/types.HttpTypes.AdminClaimPreviewResponse/page.mdx": "2025-01-07T12:54:21.225Z", "references/types/HttpTypes/interfaces/types.HttpTypes.AdminClaimPreviewResponse/page.mdx": "2025-01-07T12:54:21.225Z",
"references/types/HttpTypes/interfaces/types.HttpTypes.AdminOrderEditPreviewResponse/page.mdx": "2025-01-07T12:54:21.543Z", "references/types/HttpTypes/interfaces/types.HttpTypes.AdminOrderEditPreviewResponse/page.mdx": "2025-01-07T12:54:21.543Z",
"references/types/interfaces/types.BaseClaim/page.mdx": "2025-01-07T12:54:20.996Z", "references/types/interfaces/types.BaseClaim/page.mdx": "2025-01-07T12:54:20.996Z",
"app/commerce-modules/auth/auth-providers/github/page.mdx": "2024-10-08T07:37:27.882Z", "app/commerce-modules/auth/auth-providers/github/page.mdx": "2025-01-07T12:47:30.196Z",
"app/commerce-modules/auth/auth-providers/google/page.mdx": "2024-10-08T07:37:06.517Z", "app/commerce-modules/auth/auth-providers/google/page.mdx": "2025-01-07T12:47:32.501Z",
"app/storefront-development/customers/third-party-login/page.mdx": "2025-01-06T16:05:41.159Z", "app/storefront-development/customers/third-party-login/page.mdx": "2025-01-06T16:05:41.159Z",
"references/types/HttpTypes/types/types.HttpTypes.AdminWorkflowRunResponse/page.mdx": "2024-12-09T13:21:34.761Z", "references/types/HttpTypes/types/types.HttpTypes.AdminWorkflowRunResponse/page.mdx": "2024-12-09T13:21:34.761Z",
"references/types/HttpTypes/types/types.HttpTypes.BatchResponse/page.mdx": "2024-12-09T13:21:33.549Z", "references/types/HttpTypes/types/types.HttpTypes.BatchResponse/page.mdx": "2024-12-09T13:21:33.549Z",
@@ -467,6 +467,8 @@ This exports the module's definition, indicating that the `MyAuthProviderService
To use your Auth Module Provider, add it to the `providers` array of the Auth Module in `medusa-config.ts`: To use your Auth Module Provider, add it to the `providers` array of the Auth Module in `medusa-config.ts`:
```ts title="medusa-config.ts" ```ts title="medusa-config.ts"
import { Modules, ContainerRegistrationKeys } from "@medusajs/framework/utils"
module.exports = defineConfig({ module.exports = defineConfig({
// ... // ...
modules: [ modules: [
@@ -477,11 +479,13 @@ module.exports = defineConfig({
// default provider // default provider
{ {
resolve: "@medusajs/medusa/auth-emailpass", resolve: "@medusajs/medusa/auth-emailpass",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
id: "emailpass", id: "emailpass",
}, },
{ {
resolve: "./src/modules/my-auth", resolve: "./src/modules/my-auth",
id: "my-auth", id: "my-auth",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
options: { options: {
// provider options... // provider options...
}, },
@@ -62,6 +62,8 @@ This exports the module's definition, indicating that the \`MyAuthProviderServic
To use your Auth Module Provider, add it to the \`providers\` array of the Auth Module in \`medusa-config.ts\`: To use your Auth Module Provider, add it to the \`providers\` array of the Auth Module in \`medusa-config.ts\`:
\`\`\`ts title="medusa-config.ts" \`\`\`ts title="medusa-config.ts"
import { Modules, ContainerRegistrationKeys } from "@medusajs/framework/utils"
module.exports = defineConfig({ module.exports = defineConfig({
// ... // ...
modules: [ modules: [
@@ -72,11 +74,13 @@ module.exports = defineConfig({
// default provider // default provider
{ {
resolve: "@medusajs/medusa/auth-emailpass", resolve: "@medusajs/medusa/auth-emailpass",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
id: "emailpass", id: "emailpass",
}, },
{ {
resolve: "./src/modules/my-auth", resolve: "./src/modules/my-auth",
id: "my-auth", id: "my-auth",
dependencies: [Modules.CACHE, ContainerRegistrationKeys.LOGGER],
options: { options: {
// provider options... // provider options...
}, },