From 87b398f94c853537d64140d3e768a55d6f80ef77 Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Tue, 7 May 2024 15:16:56 +0200 Subject: [PATCH 1/6] docs: add guide for NextAuth --- .../integrate-auth/14_auth-js.mdx | 123 ++++++++++++++++++ 1 file changed, 123 insertions(+) create mode 100644 docs/getting-started/integrate-auth/14_auth-js.mdx diff --git a/docs/getting-started/integrate-auth/14_auth-js.mdx b/docs/getting-started/integrate-auth/14_auth-js.mdx new file mode 100644 index 000000000..ab0e33166 --- /dev/null +++ b/docs/getting-started/integrate-auth/14_auth-js.mdx @@ -0,0 +1,123 @@ +--- +id: auth-js +title: Integrate authentication into Auth.js and NextAuth +sidebar_label: Auth.js and NextAuth +--- + +This guide covers integrating Ory with Auth.js, a popular authentication library for Next.js applications. Auth.js is a flexible +authentication library that supports multiple authentication providers, including Ory Network out of the box. + +Auth.js is the successor to NextAuth.js, which is a popular authentication library for Next.js applications. The Ory provider +works with both Auth.js and NextAuth.js, so you can use either library to integrate Ory with your Next.js application. + +To connect your Next.js application with Ory we: + +1. Clone an example Next.js application with Auth.js +2. Create an OAuth2 client in Ory and configure Auth.js to use it +3. Perform a demo flow to see the integration in action + +Let's get started! + +## Clone the example Next.js application + +First, clone the example Next.js application with Auth.js: + +```shell-session +git clone https://github.com/nextauthjs/next-auth-example.git +cd next-auth-example +npm i +cp .env.local.example .env.local +npx auth secret +``` + +In the `auth.ts` file, replace the `profiders` array with just Ory: + +```ts title="auth.ts" +import { OryNetworkCta } from "./ory-network-cta" +export const config = { + theme: { logo: "https://authjs.dev/img/logo-sm.png" }, + providers: [ + // Apple, + // AzureB2C, + Ory, + ], + // ... +} +``` + +## Create OAuth2 Client in Ory Network + +To create the OAuth2 client, you need to know the redirect URL of your Next.js application. The redirect URL is the URL where Ory +will send the user after they log in. When running NextJS locally, the redirect URL for Auth.js is usually +`http://localhost:3000/auth/callback/ory`. + +1. Log into your Ory Network account. +2. create a new project, or select an existing one. +3. Go to ["OAuth 2" -> "Clients"](https://console.ory.sh/projects/current/oauth) and click + ["Create OAuth 2.0 Client"](https://console.ory.sh/projects/current/oauth/create). +4. Select "Server App". +5. Choose a client name, e.g. "NextAuth Example". +6. Scopes `openid` and `offline_access` are preselected. Add `email` and `profile` to the list. +7. Add redirect URLs for your NextAuth integration. In case of NextJS with Auth.js / Next-Auth, add these two URLs: + - `http://localhost:3000/api/auth/callback/ory` + - `http://localhost:3000/auth/callback/ory` +8. Scroll to the bottom and click "Create Client". +9. Copy the Client Secret and click "Done" and save it in your `.env.local` file. +10. Copy the Client ID from the client list and save it in your `.env.local` file. + +## Configure Auth.js to use Ory + +Your `.env.local` file should now look like this: + +```env +# Needed by Auth.js +AUTH_SECRET=... + +# Needed for Ory +AUTH_ORY_ID=... +AUTH_ORY_SECRET=... +``` + +Next, add the Ory Issuer URL to your `.env.local` file. The Issuer URL is the "Ory Network Project API Endpoint" you can find +[here](https://console.ory.sh/projects/current/developers/guides). Unless you have a custom domain set up for your Ory Network +project, it will be in the form of: + +``` +https://{project.slug}.projects.oryapis.com +``` + +Your final `.env.local` file should look like this: + +```env +# Needed by Auth.js +AUTH_SECRET=... + +# Needed for Ory +AUTH_ORY_ID=... +AUTH_ORY_SECRET=... +AUTH_ORY_ISSUER=... +``` + +## Test the flow + +Now everything is set up and you can run `npm run dev` to start the app and click on the top left "Sign in" button to start the +login flow. + +## Going to production + +When you are ready to go to production, you need to update the redirect URL in the Ory client settings to the production URL of +your Next.js application. + +## Trouble Shooting + +### Incorrect `redirect_uri` + +If the server responds with + +``` +The request is missing a required parameter, includes an invalid parameter value, includes a parameter more than once, or is otherwise malformed. +The 'redirect_uri' parameter does not match any of the OAuth 2.0 Client's pre-registered redirect urls. +``` + +please ensure that the redirect URL is correct. You can find the redirect URL you are sending to Ory by checking the network tab +of your browser and look for calls to `/oauth2/auth`. From 8fbdcbf91fab3d30ea4bc0e0f69532c1b0bb92a1 Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Wed, 23 Apr 2025 11:10:38 +0200 Subject: [PATCH 2/6] chore: synchronize workspaces --- .../integrate-auth/14_auth-js.mdx | 44 ++++++++++++++++--- 1 file changed, 38 insertions(+), 6 deletions(-) diff --git a/docs/getting-started/integrate-auth/14_auth-js.mdx b/docs/getting-started/integrate-auth/14_auth-js.mdx index ab0e33166..98dcf11c9 100644 --- a/docs/getting-started/integrate-auth/14_auth-js.mdx +++ b/docs/getting-started/integrate-auth/14_auth-js.mdx @@ -30,17 +30,49 @@ cp .env.local.example .env.local npx auth secret ``` -In the `auth.ts` file, replace the `profiders` array with just Ory: +In the `auth.ts` file, replace the `providers` array with just Ory: ```ts title="auth.ts" -import { OryNetworkCta } from "./ory-network-cta" +import { Profile } from "next-auth" +import { OIDCConfig } from "next-auth/providers" + export const config = { theme: { logo: "https://authjs.dev/img/logo-sm.png" }, providers: [ - // Apple, - // AzureB2C, - Ory, + { + id: "ory", + name: "Ory", + type: "oidc", + issuer: process.env.ORY_SDK_URL, + clientId: process.env.ORY_CLIENT_ID, + clientSecret: process.env.ORY_CLIENT_SECRET, + checks: ["pkce" as never, "state" as never], + token: { + idToken: true, + }, + } satisfies OIDCConfig, ], + callbacks: { + authorized({ request, auth }) { + const { pathname } = request.nextUrl + if (pathname === "/middleware-example") return !!auth + return true + }, + session({ session, token }) { + session.sid = token.sid as string + session.idToken = token.idToken as string + return session + }, + jwt({ token, user, account, profile, isNewUser }) { + if (profile) { + token.sid = profile.sid + } + if (account) { + token.idToken = account.id_token + } + return token + }, + }, // ... } ``` @@ -103,7 +135,7 @@ AUTH_ORY_ISSUER=... Now everything is set up and you can run `npm run dev` to start the app and click on the top left "Sign in" button to start the login flow. -## Going to production +## Go to production When you are ready to go to production, you need to update the redirect URL in the Ory client settings to the production URL of your Next.js application. From 36fbef17e00e96de8815c1b2f3903c8c8248858d Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Wed, 23 Apr 2025 11:24:20 +0200 Subject: [PATCH 3/6] chore: synchronize workspaces --- .../integrate-auth/14_auth-js.mdx | 59 +++++-------------- src/sidebar.ts | 5 +- src/theme/CodeFromRemote.tsx | 2 +- 3 files changed, 19 insertions(+), 47 deletions(-) diff --git a/docs/getting-started/integrate-auth/14_auth-js.mdx b/docs/getting-started/integrate-auth/14_auth-js.mdx index 98dcf11c9..497ce9e27 100644 --- a/docs/getting-started/integrate-auth/14_auth-js.mdx +++ b/docs/getting-started/integrate-auth/14_auth-js.mdx @@ -1,7 +1,7 @@ --- id: auth-js title: Integrate authentication into Auth.js and NextAuth -sidebar_label: Auth.js and NextAuth +sidebar_label: Auth.js / NextAuth --- This guide covers integrating Ory with Auth.js, a popular authentication library for Next.js applications. Auth.js is a flexible @@ -18,6 +18,10 @@ To connect your Next.js application with Ory we: Let's get started! +```mdx-code-block +import CodeFromRemote from "@theme/CodeFromRemote" +``` + ## Clone the example Next.js application First, clone the example Next.js application with Auth.js: @@ -32,49 +36,8 @@ npx auth secret In the `auth.ts` file, replace the `providers` array with just Ory: -```ts title="auth.ts" -import { Profile } from "next-auth" -import { OIDCConfig } from "next-auth/providers" - -export const config = { - theme: { logo: "https://authjs.dev/img/logo-sm.png" }, - providers: [ - { - id: "ory", - name: "Ory", - type: "oidc", - issuer: process.env.ORY_SDK_URL, - clientId: process.env.ORY_CLIENT_ID, - clientSecret: process.env.ORY_CLIENT_SECRET, - checks: ["pkce" as never, "state" as never], - token: { - idToken: true, - }, - } satisfies OIDCConfig, - ], - callbacks: { - authorized({ request, auth }) { - const { pathname } = request.nextUrl - if (pathname === "/middleware-example") return !!auth - return true - }, - session({ session, token }) { - session.sid = token.sid as string - session.idToken = token.idToken as string - return session - }, - jwt({ token, user, account, profile, isNewUser }) { - if (profile) { - token.sid = profile.sid - } - if (account) { - token.idToken = account.id_token - } - return token - }, - }, - // ... -} +```mdx-code-block + ``` ## Create OAuth2 Client in Ory Network @@ -135,6 +98,14 @@ AUTH_ORY_ISSUER=... Now everything is set up and you can run `npm run dev` to start the app and click on the top left "Sign in" button to start the login flow. +## Logout + +Log out is performed using OpenID Connect Logout: + +```mdx-code-block + +``` + ## Go to production When you are ready to go to production, you need to update the redirect URL in the Ory client settings to the production URL of diff --git a/src/sidebar.ts b/src/sidebar.ts index d6babc6e2..5d6e93cfe 100644 --- a/src/sidebar.ts +++ b/src/sidebar.ts @@ -174,11 +174,12 @@ const quickstart: SidebarItemsConfig = [ items: [ "getting-started/integrate-auth/go", "getting-started/integrate-auth/php", - "getting-started/integrate-auth/expressjs", + "getting-started/integrate-auth/auth-js", + "getting-started/integrate-auth/nextjs", "getting-started/integrate-auth/react", "getting-started/integrate-auth/react-native", + "getting-started/integrate-auth/expressjs", "getting-started/integrate-auth/vue", - "getting-started/integrate-auth/nextjs", "getting-started/integrate-auth/flutter-web-redirect", "getting-started/integrate-auth/dotnet", ], diff --git a/src/theme/CodeFromRemote.tsx b/src/theme/CodeFromRemote.tsx index ca151fbe9..50594873c 100644 --- a/src/theme/CodeFromRemote.tsx +++ b/src/theme/CodeFromRemote.tsx @@ -123,7 +123,7 @@ const CodeFromRemote = (props: { />
- see full code on GitHub + See full code on GitHub
From fdad193da6b13ab9e62405f2bfaa06c2fc9e93d5 Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Tue, 29 Apr 2025 11:34:07 +0200 Subject: [PATCH 4/6] chore: synchronize workspaces --- .../integrate-auth/14_auth-js.mdx | 88 +++++++++++-------- 1 file changed, 49 insertions(+), 39 deletions(-) diff --git a/docs/getting-started/integrate-auth/14_auth-js.mdx b/docs/getting-started/integrate-auth/14_auth-js.mdx index 497ce9e27..6122f8062 100644 --- a/docs/getting-started/integrate-auth/14_auth-js.mdx +++ b/docs/getting-started/integrate-auth/14_auth-js.mdx @@ -20,6 +20,8 @@ Let's get started! ```mdx-code-block import CodeFromRemote from "@theme/CodeFromRemote" +import Tabs from "@theme/Tabs" +import TabItem from "@theme/TabItem" ``` ## Clone the example Next.js application @@ -46,61 +48,69 @@ To create the OAuth2 client, you need to know the redirect URL of your Next.js a will send the user after they log in. When running NextJS locally, the redirect URL for Auth.js is usually `http://localhost:3000/auth/callback/ory`. + +````mdx-code-block + + + 1. Log into your Ory Network account. -2. create a new project, or select an existing one. -3. Go to ["OAuth 2" -> "Clients"](https://console.ory.sh/projects/current/oauth) and click - ["Create OAuth 2.0 Client"](https://console.ory.sh/projects/current/oauth/create). -4. Select "Server App". -5. Choose a client name, e.g. "NextAuth Example". -6. Scopes `openid` and `offline_access` are preselected. Add `email` and `profile` to the list. -7. Add redirect URLs for your NextAuth integration. In case of NextJS with Auth.js / Next-Auth, add these two URLs: - - `http://localhost:3000/api/auth/callback/ory` - - `http://localhost:3000/auth/callback/ory` -8. Scroll to the bottom and click "Create Client". -9. Copy the Client Secret and click "Done" and save it in your `.env.local` file. -10. Copy the Client ID from the client list and save it in your `.env.local` file. +2. Create a new project or select an existing one. +3. Go to **OAuth 2**, select [**OAuth2 Clients**](https://console.ory.sh/projects/current/oauth), and click + [**Create OAuth 2.0 Client**](https://console.ory.sh/projects/current/oauth/create). +4. Select **Server App**. +5. Choose a client name, e.g. "NextAuth / Auth.js Example". +6. Scopes `openid` and `offline_access` are preselected. Add to the list: + - `email` + - `profile` +7. Add to **Redirect URIs** value `http://localhost:3000/api/auth/callback/ory`. +8. Add to **Post Logout Redirect URIs** value `http://localhost:3000/`. +8. Scroll to the bottom and click **Create Client**. +9. Copy the Client Secret save it as `ORY_CLIENT_SECRET` your `.env.local` file. Click **Done**. +10. Copy the Client ID from the client list and save it as `ORY_CLIENT_ID` your `.env.local` file. + + + + +Run this command: + +```shell +ory create oauth2-client --project \ + --redirect-uri http://localhost:3000/api/auth/callback/ory \ + --name "NextAuth / Auth.js Example" \ + --scopes openid offline_access email profile \ + --skip-consent \ + --post-logout-callback +``` + + + +```` ## Configure Auth.js to use Ory Your `.env.local` file should now look like this: -```env -# Needed by Auth.js -AUTH_SECRET=... - -# Needed for Ory -AUTH_ORY_ID=... -AUTH_ORY_SECRET=... +```mdx-code-block + ``` -Next, add the Ory Issuer URL to your `.env.local` file. The Issuer URL is the "Ory Network Project API Endpoint" you can find -[here](https://console.ory.sh/projects/current/developers/guides). Unless you have a custom domain set up for your Ory Network -project, it will be in the form of: +Next, add the Ory SDK URL to your `.env.local` file. The Ory SDK URL can be taken from the +[**Get started**](https://console.ory:8080/projects/current/get-started) section in the Ory Console. -``` -https://{project.slug}.projects.oryapis.com -``` - -Your final `.env.local` file should look like this: +## Test the flow -```env -# Needed by Auth.js -AUTH_SECRET=... +Now everything is set up, and you can run -# Needed for Ory -AUTH_ORY_ID=... -AUTH_ORY_SECRET=... -AUTH_ORY_ISSUER=... +``` +npm run dev ``` -## Test the flow - -Now everything is set up and you can run `npm run dev` to start the app and click on the top left "Sign in" button to start the +to start the app and click on the top left "Sign in" button to start the login flow. ## Logout -Log out is performed using OpenID Connect Logout: +Logout is performed using OpenID Connect Logout: ```mdx-code-block @@ -108,7 +118,7 @@ Log out is performed using OpenID Connect Logout: ## Go to production -When you are ready to go to production, you need to update the redirect URL in the Ory client settings to the production URL of +When you are ready to go to production, you need to update the redirect and post-logout redirect URL in the OAuth2 client settings to the production URL of your Next.js application. ## Trouble Shooting From cb49ebbc41c46f24fa780506d872c0cb92dcd399 Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Tue, 29 Apr 2025 11:42:10 +0200 Subject: [PATCH 5/6] chore: synchronize workspaces --- .../integrate-auth/14_auth-js.mdx | 147 ++++++++++-------- 1 file changed, 86 insertions(+), 61 deletions(-) diff --git a/docs/getting-started/integrate-auth/14_auth-js.mdx b/docs/getting-started/integrate-auth/14_auth-js.mdx index 6122f8062..81c3af319 100644 --- a/docs/getting-started/integrate-auth/14_auth-js.mdx +++ b/docs/getting-started/integrate-auth/14_auth-js.mdx @@ -4,19 +4,20 @@ title: Integrate authentication into Auth.js and NextAuth sidebar_label: Auth.js / NextAuth --- -This guide covers integrating Ory with Auth.js, a popular authentication library for Next.js applications. Auth.js is a flexible -authentication library that supports multiple authentication providers, including Ory Network out of the box. +# Integrate authentication into Auth.js and NextAuth -Auth.js is the successor to NextAuth.js, which is a popular authentication library for Next.js applications. The Ory provider -works with both Auth.js and NextAuth.js, so you can use either library to integrate Ory with your Next.js application. +This guide explains how to integrate Ory with [Auth.js](https://authjs.dev/), a flexible authentication library for Next.js +applications. Auth.js supports multiple providers, including Ory Network. -To connect your Next.js application with Ory we: +Auth.js is the successor to NextAuth.js. The Ory provider works with both libraries. -1. Clone an example Next.js application with Auth.js -2. Create an OAuth2 client in Ory and configure Auth.js to use it -3. Perform a demo flow to see the integration in action +Follow these steps to integrate Ory: -Let's get started! +- Clone an example Next.js application +- Create and configure an OAuth2 client in Ory +- Configure Auth.js to use Ory +- Test the authentication flow +- Move the integration to production ```mdx-code-block import CodeFromRemote from "@theme/CodeFromRemote" @@ -24,113 +25,137 @@ import Tabs from "@theme/Tabs" import TabItem from "@theme/TabItem" ``` -## Clone the example Next.js application +## Clone and set up the example Next.js application -First, clone the example Next.js application with Auth.js: +To set up the example application: -```shell-session -git clone https://github.com/nextauthjs/next-auth-example.git -cd next-auth-example -npm i -cp .env.local.example .env.local -npx auth secret -``` +1. Open a terminal window. +2. Run the following commands: -In the `auth.ts` file, replace the `providers` array with just Ory: + ```shell-session + git clone https://github.com/ory/next-auth-example.git + cd next-auth-example + npm install + cp .env.local.example .env.local + npx auth secret + ``` -```mdx-code-block - -``` +3. Open the `auth.ts` file. +4. Check the `providers` array which uses Ory: -## Create OAuth2 Client in Ory Network + ```mdx-code-block + + ``` -To create the OAuth2 client, you need to know the redirect URL of your Next.js application. The redirect URL is the URL where Ory -will send the user after they log in. When running NextJS locally, the redirect URL for Auth.js is usually -`http://localhost:3000/auth/callback/ory`. +## Create and configure an OAuth2 client in Ory Network +You must know your application's redirect URL. When running locally, the redirect URL is: + +``` +http://localhost:3000/api/auth/callback/ory +``` ````mdx-code-block -1. Log into your Ory Network account. -2. Create a new project or select an existing one. -3. Go to **OAuth 2**, select [**OAuth2 Clients**](https://console.ory.sh/projects/current/oauth), and click - [**Create OAuth 2.0 Client**](https://console.ory.sh/projects/current/oauth/create). +To create the client using the Ory Console: + +1. Sign in to your Ory Network account. +2. Create or select a project. +3. Go to **OAuth 2**, select [**OAuth2 Clients**](https://console.ory.sh/projects/current/oauth), and select [**Create OAuth 2.0 Client**](https://console.ory.sh/projects/current/oauth/create). 4. Select **Server App**. -5. Choose a client name, e.g. "NextAuth / Auth.js Example". -6. Scopes `openid` and `offline_access` are preselected. Add to the list: +5. Enter a client name, for example, "NextAuth / Auth.js Example." +6. Ensure the following scopes are selected: + - `openid` + - `offline_access` - `email` - `profile` -7. Add to **Redirect URIs** value `http://localhost:3000/api/auth/callback/ory`. -8. Add to **Post Logout Redirect URIs** value `http://localhost:3000/`. -8. Scroll to the bottom and click **Create Client**. -9. Copy the Client Secret save it as `ORY_CLIENT_SECRET` your `.env.local` file. Click **Done**. -10. Copy the Client ID from the client list and save it as `ORY_CLIENT_ID` your `.env.local` file. +7. Add the following to **Redirect URIs**: + + ``` + http://localhost:3000/api/auth/callback/ory + ``` + +8. Add the following to **Post Logout Redirect URIs**: + + ``` + http://localhost:3000/ + ``` + +9. Select **Create Client**. +10. Save the Client Secret as `ORY_CLIENT_SECRET` in your `.env.local` file. +11. Save the Client ID as `ORY_CLIENT_ID` in your `.env.local` file. + -Run this command: +To create the client using the Ory CLI, run the following command: ```shell -ory create oauth2-client --project \ +export ORY_PROJECT_ID= # Take this value from https://console.ory.sh/projects/current/get-started +ory create oauth2-client --project $ORY_PROJECT_ID \ --redirect-uri http://localhost:3000/api/auth/callback/ory \ --name "NextAuth / Auth.js Example" \ --scopes openid offline_access email profile \ --skip-consent \ - --post-logout-callback + --post-logout-callback http://localhost:3000/ ``` ```` -## Configure Auth.js to use Ory +## Configure Auth.js to use Ory in the Next.js application -Your `.env.local` file should now look like this: +Update your `.env.local` file to match the example: ```mdx-code-block ``` -Next, add the Ory SDK URL to your `.env.local` file. The Ory SDK URL can be taken from the -[**Get started**](https://console.ory:8080/projects/current/get-started) section in the Ory Console. +Also add your Ory SDK URL. You can find it in the [**Get started**](https://console.ory.sh/projects/current/get-started) section +of the Ory Console. -## Test the flow +## Test the authentication flow in your application -Now everything is set up, and you can run +To run the application: -``` +1. Open a terminal window. +2. Run the following command: + +```shell-session npm run dev ``` -to start the app and click on the top left "Sign in" button to start the -login flow. +3. Open your browser and go to `http://localhost:3000`. +4. Select **Sign in** to start the authentication flow. -## Logout +## Configure user sign-out with Ory -Logout is performed using OpenID Connect Logout: +To sign out users, use the OpenID Connect logout flow: ```mdx-code-block - + ``` -## Go to production +## Move the integration to production + +Before deploying to production: -When you are ready to go to production, you need to update the redirect and post-logout redirect URL in the OAuth2 client settings to the production URL of -your Next.js application. +- Update the **Redirect URIs** and **Post Logout Redirect URIs** in your OAuth2 client settings to match your production domain. -## Trouble Shooting +## Troubleshoot common integration errors -### Incorrect `redirect_uri` +### Resolve redirect URL mismatch errors -If the server responds with +If you receive the following error: ``` The request is missing a required parameter, includes an invalid parameter value, includes a parameter more than once, or is otherwise malformed. -The 'redirect_uri' parameter does not match any of the OAuth 2.0 Client's pre-registered redirect urls. +The 'redirect_uri' parameter does not match any of the OAuth 2.0 Client's pre-registered redirect URLs. ``` -please ensure that the redirect URL is correct. You can find the redirect URL you are sending to Ory by checking the network tab -of your browser and look for calls to `/oauth2/auth`. +Make sure that the redirect URL exactly matches the one registered in Ory. Use the browser’s network tab to inspect requests made +to `/oauth2/auth`. From 2b504e6957db3dfc5d971233c07f3201fea36eac Mon Sep 17 00:00:00 2001 From: aeneasr <3372410+aeneasr@users.noreply.github.com> Date: Tue, 29 Apr 2025 11:46:34 +0200 Subject: [PATCH 6/6] chore: synchronize workspaces --- .../integrate-auth/14_auth-js.mdx | 20 +++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/docs/getting-started/integrate-auth/14_auth-js.mdx b/docs/getting-started/integrate-auth/14_auth-js.mdx index 81c3af319..2c16598bc 100644 --- a/docs/getting-started/integrate-auth/14_auth-js.mdx +++ b/docs/getting-started/integrate-auth/14_auth-js.mdx @@ -32,20 +32,20 @@ To set up the example application: 1. Open a terminal window. 2. Run the following commands: - ```shell-session - git clone https://github.com/ory/next-auth-example.git - cd next-auth-example - npm install - cp .env.local.example .env.local - npx auth secret - ``` + ```shell-session + git clone https://github.com/ory/next-auth-example.git + cd next-auth-example + npm install + cp .env.local.example .env.local + npx auth secret + ``` 3. Open the `auth.ts` file. 4. Check the `providers` array which uses Ory: - ```mdx-code-block - - ``` + ```mdx-code-block + + ``` ## Create and configure an OAuth2 client in Ory Network