NextAuth.js

https://next-auth.js.org
Admin
NextAuth.js is an open-source authentication library for Next.js applications that provides built-in...
Tokens:90,109
Snippets:866
Trust Score:8.1
Update:1 week ago
Show doc for...
Tokens:
Raw
### FreshbooksProvider setup example

Source: https://next-auth.js.org/providers/freshbooks

Example of configuring the Freshbooks provider in NextAuth.js. Requires FRESHBOOKS_CLIENT_ID and FRESHBOOKS_CLIENT_SECRET environment variables.

```javascript
import FreshbooksProvider from "next-auth/providers/freshbooks";  
...  
providers: [  
  FreshbooksProvider({  
    clientId: process.env.FRESHBOOKS_CLIENT_ID,  
    clientSecret: process.env.FRESHBOOKS_CLIENT_SECRET,  
  })  
]  
...  

```

--------------------------------

### ZoomProvider setup example

Source: https://next-auth.js.org/providers/zoom

Import the Zoom provider and add it to the providers array with your Zoom client ID and secret from environment variables.

```javascript
import ZoomProvider from "next-auth/providers/zoom"
...
providers: [
  ZoomProvider({
    clientId: process.env.ZOOM_CLIENT_ID,
    clientSecret: process.env.ZOOM_CLIENT_SECRET
  })
}
...
```

--------------------------------

### TodoistProvider setup example

Source: https://next-auth.js.org/providers/todoist

Imports the Todoist provider and adds it to the providers array with clientId and clientSecret from environment variables.

```javascript
import TodoistProvider from "next-auth/providers/todoist";

...
providers: [
  TodoistProvider({
    clientId: process.env.TODOIST_ID,
    clientSecret: process.env.TODOIST_SECRET
  })
]
...
```

--------------------------------

### KakaoProvider configuration example

Source: https://next-auth.js.org/providers/kakao

Example of configuring the Kakao provider with client ID and secret from environment variables. Requires a Kakao application and callback URL setup.

```javascript
import KakaoProvider from "next-auth/providers/kakao";  
...  
providers: [  
  KakaoProvider({  
    clientId: process.env.KAKAO_CLIENT_ID,  
    clientSecret: process.env.KAKAO_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### PinterestProvider setup example

Source: https://next-auth.js.org/providers/pinterest

Example of configuring the Pinterest provider in NextAuth.js. Requires setting PINTEREST_ID and PINTEREST_SECRET environment variables. For production, the Pinterest app must have standard API access, not trial access.

```javascript
import PinterestProvider from "next-auth/providers/pinterest"
...  
providers: [  
  PinterestProvider({  
    clientId: process.env.PINTEREST_ID,  
    clientSecret: process.env.PINTEREST_SECRET  
  })  
]  
...  

:::tip  
To use in production, make sure the app has standard API access and not trial access  
:::  

```

--------------------------------

### Install @auth/fauna-adapter with bun

Source: https://next-auth.js.org/adapters/fauna

Install the Fauna adapter and the fauna client library using bun.

```bash
bun add @auth/fauna-adapter fauna
```

--------------------------------

### Mail.ru Provider Setup Example

Source: https://next-auth.js.org/providers/mailru

Example of configuring the Mail.ru provider in NextAuth.js. Requires MAILRU_CLIENT_ID and MAILRU_CLIENT_SECRET environment variables.

```javascript
import MailRuProvider from "next-auth/providers/mailru";  
...  
providers: [  
  MailRuProvider({  
    clientId: process.env.MAILRU_CLIENT_ID,  
    clientSecret: process.env.MAILRU_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### osu! Provider Configuration Example

Source: https://next-auth.js.org/providers/osu

Basic setup for the osu! provider in NextAuth.js. Requires OSU_CLIENT_ID and OSU_CLIENT_SECRET environment variables. Note that osu! does not provide a user email.

```javascript
import OsuProvider from "next-auth/providers/osu";
...
providers: [
  OsuProvider({
    clientId: process.env.OSU_CLIENT_ID,
    clientSecret: process.env.OSU_CLIENT_SECRET
  })
]
...
```

--------------------------------

### Twitch Provider Setup Example

Source: https://next-auth.js.org/providers/twitch

Example of configuring the Twitch provider in NextAuth.js. Requires setting TWITCH_CLIENT_ID and TWITCH_CLIENT_SECRET environment variables. The redirect URL must be set to http://<your-next-app-url>/api/auth/callback/twitch in the Twitch console.

```javascript
import TwitchProvider from "next-auth/providers/twitch";
...
providers: [
  TwitchProvider({
    clientId: process.env.TWITCH_CLIENT_ID,
    clientSecret: process.env.TWITCH_CLIENT_SECRET
  })
]
...
```

--------------------------------

### Example redirect URI for Google in example application

Source: https://next-auth.js.org/configuration/providers/oauth

Example of the redirect URI for Google in the NextAuth.js example application.

```text
https://next-auth-example.vercel.app/api/auth/callback/google  
```

--------------------------------

### Install @auth/fauna-adapter with npm

Source: https://next-auth.js.org/adapters/fauna

Install the Fauna adapter and the fauna client library using npm.

```bash
npm install @auth/fauna-adapter fauna
```

--------------------------------

### Install @auth/fauna-adapter with yarn

Source: https://next-auth.js.org/adapters/fauna

Install the Fauna adapter and the fauna client library using yarn.

```bash
yarn add @auth/fauna-adapter fauna
```

--------------------------------

### Install @auth/fauna-adapter with pnpm

Source: https://next-auth.js.org/adapters/fauna

Install the Fauna adapter and the fauna client library using pnpm.

```bash
pnpm add @auth/fauna-adapter fauna
```

--------------------------------

### TypeORM adapter migration

Source: https://next-auth.js.org/getting-started/upgrade-v4

Migration example for the removed database option. Install the external adapter package and replace the database option with the adapter option using TypeORMLegacyAdapter.

```javascript
// [...nextauth].js  
import NextAuth from "next-auth"  
+ import { TypeORMLegacyAdapter } from "@next-auth/typeorm-legacy-adapter"  
  
...  
export default NextAuth({  
-  database: "yourconnectionstring",  
+  adapter: TypeORMLegacyAdapter("yourconnectionstring")  
})  
```

--------------------------------

### Spotify Provider Configuration Example

Source: https://next-auth.js.org/providers/spotify

Example of configuring the Spotify provider in NextAuth.js. Requires setting SPOTIFY_CLIENT_ID and SPOTIFY_CLIENT_SECRET environment variables.

```javascript
import SpotifyProvider from "next-auth/providers/spotify";  
...  
providers: [  
  SpotifyProvider({  
    clientId: process.env.SPOTIFY_CLIENT_ID,  
    clientSecret: process.env.SPOTIFY_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### FACEIT Provider Example

Source: https://next-auth.js.org/providers/faceit

Example of configuring the FACEIT provider in NextAuth.js. Requires FACEIT_CLIENT_ID and FACEIT_CLIENT_SECRET environment variables.

```javascript
import FaceItProvider from "next-auth/providers/faceit";  
...  
providers: [  
  FaceItProvider({  
    clientId: process.env.FACEIT_CLIENT_ID,  
    clientSecret: process.env.FACEIT_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### Install ldapjs with pnpm

Source: https://next-auth.js.org/tutorials/ldap-auth-example

Install the ldapjs dependency using pnpm.

```bash
pnpm add ldapjs
```

--------------------------------

### DiscordProvider configuration example

Source: https://next-auth.js.org/providers/discord

Import DiscordProvider from next-auth/providers/discord and add it to the providers array with clientId and clientSecret from environment variables.

```javascript
import DiscordProvider from "next-auth/providers/discord";
...
providers: [
  DiscordProvider({
    clientId: process.env.DISCORD_CLIENT_ID,
    clientSecret: process.env.DISCORD_CLIENT_SECRET
  })
]
...
```

--------------------------------

### AtlassianProvider configuration example

Source: https://next-auth.js.org/providers/atlassian

Example of configuring the Atlassian provider with client ID, client secret, and authorization scope. Requires setting ATLASSIAN_CLIENT_ID and ATLASSIAN_CLIENT_SECRET environment variables. The scope includes write:jira-work, read:jira-work, read:jira-user, offline_access, and read:me.

```javascript
import AtlassianProvider from "next-auth/providers/atlassian";
...
providers: [
  AtlassianProvider({
    clientId: process.env.ATLASSIAN_CLIENT_ID,
    clientSecret: process.env.ATLASSIAN_CLIENT_SECRET,
    authorization: {
      params: {
        scope: "write:jira-work read:jira-work read:jira-user offline_access read:me"
      }
    }
  })
]
...
```

--------------------------------

### Install ldapjs with npm

Source: https://next-auth.js.org/tutorials/ldap-auth-example

Install the ldapjs dependency using npm.

```bash
npm install ldapjs
```

--------------------------------

### KeycloakProvider configuration example

Source: https://next-auth.js.org/providers/keycloak

Example of configuring the Keycloak provider in NextAuth.js. Requires environment variables KEYCLOAK_ID, KEYCLOAK_SECRET, and KEYCLOAK_ISSUER. The issuer must include the realm, e.g., https://my-keycloak-domain.com/realms/My_Realm.

```javascript
import KeycloakProvider from "next-auth/providers/keycloak";  
...  
providers: [  
  KeycloakProvider({  
    clientId: process.env.KEYCLOAK_ID,  
    clientSecret: process.env.KEYCLOAK_SECRET,  
    issuer: process.env.KEYCLOAK_ISSUER,  
  })  
]  
...  

```

--------------------------------

### Pipedrive Provider Configuration Example

Source: https://next-auth.js.org/providers/pipedrive

Example of configuring the Pipedrive provider in NextAuth.js. It imports PipedriveProvider and sets the clientId and clientSecret from environment variables.

```javascript
import PipedriveProvider from "next-auth/providers/pipedrive";  
...  
providers: [  
  PipedriveProvider({  
    clientId: process.env.PIPEDRIVE_CLIENT_ID,  
    clientSecret: process.env.PIPEDRIVE_CLIENT_SECRET,  
  })  
]  
...  

```

--------------------------------

### Salesforce Provider Configuration Example

Source: https://next-auth.js.org/providers/salesforce

Example of configuring the Salesforce provider in NextAuth.js. Requires setting SALESFORCE_CLIENT_ID and SALESFORCE_CLIENT_SECRET environment variables. The provider is imported from 'next-auth/providers/salesforce' and added to the providers array.

```javascript
import SalesforceProvider from "next-auth/providers/salesforce";
...
providers: [
  SalesforceProvider({
    clientId: process.env.SALESFORCE_CLIENT_ID,
    clientSecret: process.env.SALESFORCE_CLIENT_SECRET,
  })
]
...
```

--------------------------------

### Install NextAuth.js with npm, yarn, or pnpm

Source: https://next-auth.js.org/getting-started/example

Install NextAuth.js using your preferred package manager. The npm, yarn, and pnpm commands are equivalent alternatives; choose one based on your project's package manager.

```bash
npm install next-auth
```

```bash
yarn add next-auth
```

```bash
pnpm add next-auth
```

--------------------------------

### Auth0Provider configuration example

Source: https://next-auth.js.org/providers/auth0

Example of configuring the Auth0 provider in NextAuth.js. Requires setting AUTH0_CLIENT_ID, AUTH0_CLIENT_SECRET, and AUTH0_ISSUER environment variables. The issuer must be the fully qualified URL, e.g., https://dev-s6clz2lv.eu.auth0.com.

```javascript
import Auth0Provider from "next-auth/providers/auth0";
...
providers: [
  Auth0Provider({
    clientId: process.env.AUTH0_CLIENT_ID,
    clientSecret: process.env.AUTH0_CLIENT_SECRET,
    issuer: process.env.AUTH0_ISSUER
  })
]
...
```

--------------------------------

### PatreonProvider configuration example

Source: https://next-auth.js.org/providers/patreon

Example of adding the Patreon provider to NextAuth.js. Requires PATREON_ID and PATREON_SECRET environment variables. Ensure the scopes defined in ApiV2 are used.

```javascript
import PatreonProvider from "next-auth/providers/patreon";  
...  
providers: [  
    PatreonProvider({  
      clientId: process.env.PATREON_ID,  
      clientSecret: process.env.PATREON_SECRET,  
    })  
]  
...  

```

--------------------------------

### Coinbase Provider Example

Source: https://next-auth.js.org/providers/coinbase

Example of configuring the Coinbase provider in NextAuth.js. Requires setting COINBASE_CLIENT_ID and COINBASE_CLIENT_SECRET environment variables. The access token expires after 2 hours and a refresh token is returned.

```javascript
import CoinbaseProvider from "next-auth/providers/coinbase";  
...  
providers: [  
  CoinbaseProvider({  
    clientId: process.env.COINBASE_CLIENT_ID,  
    clientSecret: process.env.COINBASE_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### GitHubProvider configuration example

Source: https://next-auth.js.org/providers/github

Example of configuring the GitHub provider in NextAuth.js. It imports GitHubProvider and sets clientId and clientSecret from environment variables. Note: only one callback URL is allowed per Client ID/Client Secret, and the email address is always returned even if the user has no public email.

```javascript
import GitHubProvider from "next-auth/providers/github";
...
providers: [
  GitHubProvider({
    clientId: process.env.GITHUB_ID,
    clientSecret: process.env.GITHUB_SECRET
  })
]
...
```

--------------------------------

### signIn callback example with redirect

Source: https://next-auth.js.org/configuration/callbacks

Example of the signIn callback that controls whether a user is allowed to sign in. Returns true to allow, false to show a default error, or a URL to redirect to. Note: redirects returned by this callback cancel the authentication flow.

```javascript
...  
callbacks: {  
  async signIn({ user, account, profile, email, credentials }) {  
    const isAllowedToSignIn = true  
    if (isAllowedToSignIn) {  
      return true  
    } else {  
      // Return false to display a default error message  
      return false  
      // Or you can return a URL to redirect to:  
      // return '/unauthorized'  
    }  
  }  
}  
...  

```

--------------------------------

### SlackProvider configuration example

Source: https://next-auth.js.org/providers/slack

Example of configuring the Slack provider in NextAuth.js. Requires SLACK_CLIENT_ID and SLACK_CLIENT_SECRET environment variables. Note that Slack requires HTTPS redirect URLs, even for local development; use a service like ngrok and set NEXTAUTH_URL accordingly.

```javascript
import SlackProvider from "next-auth/providers/slack";
...
providers: [
  SlackProvider({
    clientId: process.env.SLACK_CLIENT_ID,
    clientSecret: process.env.SLACK_CLIENT_SECRET
  })
]
...
```

--------------------------------

### Add host entry for local development (Linux/macOS)

Source: https://next-auth.js.org/providers/apple

Appends '127.0.0.1 dev.example.com' to /etc/hosts to resolve the local development domain. Run with sudo.

```bash
echo '127.0.0.1 dev.example.com' | sudo tee -a /etc/hosts

```

--------------------------------

### Simple initialization with API Routes (/pages/api/auth/[...nextauth].ts)

Source: https://next-auth.js.org/configuration/initialization

Define a catch-all API route in the pages directory. Every request beginning with /api/auth/* is handled by this file. Pass your options to NextAuth and it handles the rest. This is the preferred initialization in tutorials.

```typescript
import NextAuth from "next-auth"
  
export default NextAuth({  
  ...  
})  
```

--------------------------------

### Configure Fauna adapter in Qwik (/src/routes/plugin@auth.ts)

Source: https://next-auth.js.org/adapters/fauna

Configuration example for Qwik using the Fauna adapter. Uses import.meta.env for environment variables.

```typescript
import { QwikAuth$ } from "@auth/qwik"
import { Client } from "fauna"
import { FaunaAdapter } from "@auth/fauna-adapter"
 
const client = new Client({
  secret: import.meta.env.AUTH_FAUNA_SECRET,
  endpoint: new URL(import.meta.env.AUTH_FAUNA_CLIENT),
})
 
export const { onRequest, useSession, useSignIn, useSignOut } = QwikAuth$(
  () => ({
    providers: [],
    adapter: FaunaAdapter(client),
  })
)
```

--------------------------------

### Install ldapjs with yarn

Source: https://next-auth.js.org/tutorials/ldap-auth-example

Install the ldapjs dependency using yarn.

```bash
yarn add ldapjs
```

--------------------------------

### Basic ZITADEL Provider Setup

Source: https://next-auth.js.org/providers/zitadel

Configures the ZITADEL provider with issuer, client ID, and client secret from environment variables. Requires setting the redirect URI to include the full domain and callback path, e.g., https://{YOUR_DOMAIN}/api/auth/callback/zitadel.

```javascript
import ZitadelProvider from "next-auth/providers/zitadel";  
...  
providers: [  
  ZitadelProvider({  
    issuer: process.env.ZITADEL_ISSUER,  
    clientId: process.env.ZITADEL_CLIENT_ID,  
    clientSecret: process.env.ZITADEL_CLIENT_SECRET,  
  })  
]  
...  

```

--------------------------------

### Install nodemailer with yarn

Source: https://next-auth.js.org/configuration/providers/email

Install the nodemailer package using yarn, an alternative to npm.

```bash
yarn add nodemailer
```

--------------------------------

### Example redirect URI for Twitter on localhost

Source: https://next-auth.js.org/configuration/providers/oauth

Example of the redirect URI for Twitter when running on localhost.

```text
http://localhost:3000/api/auth/callback/twitter  
```

--------------------------------

### Install nodemailer with pnpm

Source: https://next-auth.js.org/configuration/providers/email

Install the nodemailer package using pnpm, an alternative to npm and yarn.

```bash
pnpm add nodemailer
```

--------------------------------

### Configure 42 School provider with NextAuth.js

Source: https://next-auth.js.org/providers/42-school

Import the FortyTwoProvider and add it to the providers array with your client ID and secret from environment variables. Ensure your database schema includes the `created_at` field on the Account model if using an adapter.

```javascript
import FortyTwoProvider from "next-auth/providers/42-school";  
...  
providers: [  
  FortyTwoProvider({  
    clientId: process.env.FORTY_TWO_CLIENT_ID,  
    clientSecret: process.env.FORTY_TWO_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### MailchimpProvider configuration example

Source: https://next-auth.js.org/providers/mailchimp

Example of configuring the Mailchimp provider in NextAuth.js. Requires MAILCHIMP_CLIENT_ID and MAILCHIMP_CLIENT_SECRET environment variables.

```javascript
import MailchimpProvider from "next-auth/providers/mailchimp";  
...  
providers: [  
  MailchimpProvider({  
    clientId: process.env.MAILCHIMP_CLIENT_ID,  
    clientSecret: process.env.MAILCHIMP_CLIENT_SECRET  
  })  
]  
...  

```

--------------------------------

### Start Email sign-in flow with email option

Source: https://next-auth.js.org/getting-started/client

Calls signIn() with the provider "email" and passes the target email as an option.

```javascript
import { signIn } from "next-auth/react"  
  
export default ({ email }) => (  
  <button onClick={() => signIn("email", { email })}>Sign in with Email</button>  
)  

```

--------------------------------

### Install nodemailer with npm

Source: https://next-auth.js.org/configuration/providers/email

Install the nodemailer package using npm, which is required for the Email provider's default sendVerificationRequest.

```bash
npm install nodemailer
```

--------------------------------

### OneLoginProvider configuration example

Source: https://next-auth.js.org/providers/onelogin

Import OneLoginProvider from next-auth/providers/onelogin and add it to the providers array with clientId, clientSecret, and issuer from environment variables.

```javascript
import OneLoginProvider from "next-auth/providers/onelogin";  
...  
providers: [  
  OneLoginProvider({  
    clientId: process.env.ONELOGIN_CLIENT_ID,  
    clientSecret: process.env.ONELOGIN_CLIENT_SECRET,  
    issuer: process.env.ONELOGIN_ISSUER  
  })  
]  
...  
```

--------------------------------

### Install Cypress dependencies with pnpm

Source: https://next-auth.js.org/tutorials/testing-with-cypress

Install Cypress, cypress-social-logins, and @testing-library/cypress as dev dependencies using pnpm. Required for testing NextAuth.js with Cypress.

```bash
pnpm add --save-dev cypress cypress-social-logins @testing-library/cypress
```

--------------------------------

### Hosts file entry for local development

Source: https://next-auth.js.org/providers/bungie

The resulting line to add to the hosts file, mapping 127.0.0.1 to dev.example.com.

```text
127.0.0.1 dev.example.com  

```

--------------------------------

### Install Cypress dependencies with yarn

Source: https://next-auth.js.org/tutorials/testing-with-cypress

Install Cypress, cypress-social-logins, and @testing-library/cypress as dev dependencies using yarn. Required for testing NextAuth.js with Cypress.

```bash
yarn add --dev cypress cypress-social-logins @testing-library/cypress
```

--------------------------------

### Install Cypress dependencies with npm

Source: https://next-auth.js.org/tutorials/testing-with-cypress

Install Cypress, cypress-social-logins, and @testing-library/cypress as dev dependencies using npm. Required for testing NextAuth.js with Cypress.

```bash
npm install --save-dev cypress cypress-social-logins @testing-library/cypress
```
Tokens:
Raw