Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all \u003cpre\u003e\u003ccode\u003e blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks"); } } catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); } })(); (function(){ try { var __m = "github.com"; var __re = new RegExp('^' + "github\\.com" + '
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length \u003e 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages

, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content

Repository files navigation


NextAuth.js

Authentication for Next.js

Open Source. Full Stack. Own Your Data.

ReleaseBundle SizeDownloadsGithub StarsGithub Stable Release

Overview

NextAuth.js is a complete open source authentication solution for Next.js applications.

It is designed from the ground up to support Next.js and Serverless.

This is a monorepo containing the following packages / projects:

  1. The primary next-auth package
  2. A development test application
  3. All @next-auth/*-adapter packages
  4. The documentation site

Getting Started

npm install next-auth

The easiest way to continue getting started, is to follow the getting started section in our docs.

We also have a section of tutorials for those looking for more specific examples.

See next-auth.js.org for more information and documentation.

Features

Flexible and easy to use

  • Designed to work with any OAuth service, it supports OAuth 1.0, 1.0A and 2.0
  • Built-in support for many popular sign-in services
  • Supports email / passwordless authentication
  • Supports stateless authentication with any backend (Active Directory, LDAP, etc)
  • Supports both JSON Web Tokens and database sessions
  • Designed for Serverless but runs anywhere (AWS Lambda, Docker, Heroku, etc…)

Own your own data

NextAuth.js can be used with or without a database.

  • An open source solution that allows you to keep control of your data
  • Supports Bring Your Own Database (BYOD) and can be used with any database
  • Built-in support for MySQL, MariaDB, Postgres, Microsoft SQL Server, MongoDB and SQLite
  • Works great with databases from popular hosting providers
  • Can also be used without a database (e.g. OAuth + JWT)

Secure by default

  • Promotes the use of passwordless sign-in mechanisms
  • Designed to be secure by default and encourage best practices for safeguarding user data
  • Uses Cross-Site Request Forgery (CSRF) Tokens on POST routes (sign in, sign out)
  • Default cookie policy aims for the most restrictive policy appropriate for each cookie
  • When JSON Web Tokens are enabled, they are encrypted by default (JWE) with A256GCM
  • Auto-generates symmetric signing and encryption keys for developer convenience
  • Features tab/window syncing and session polling to support short lived sessions
  • Attempts to implement the latest guidance published by Open Web Application Security Project

Advanced options allow you to define your own routines to handle controlling what accounts are allowed to sign in, for encoding and decoding JSON Web Tokens and to set custom cookie security policies and session properties, so you can control who is able to sign in and how often sessions have to be re-validated.

TypeScript

NextAuth.js comes with built-in types. For more information and usage, check out the TypeScript section in the documentation.

Example

Add API Route

// pages/api/auth/[...nextauth].jsimportNextAuthfrom"next-auth"importAppleProviderfrom"next-auth/providers/apple"importGoogleProviderfrom"next-auth/providers/google"importEmailProviderfrom"next-auth/providers/email"exportdefaultNextAuth({secret: process.env.SECRET,providers: [// OAuth authentication providersAppleProvider({clientId: process.env.APPLE_ID,clientSecret: process.env.APPLE_SECRET,}),GoogleProvider({clientId: process.env.GOOGLE_ID,clientSecret: process.env.GOOGLE_SECRET,}),// Sign in with passwordless email linkEmailProvider({server: process.env.MAIL_SERVER,from: "<no-reply@example.com>",}),],})

Add React Hook

The useSession() React Hook in the NextAuth.js client is the easiest way to check if someone is signed in.

import{useSession,signIn,signOut}from"next-auth/react"exportdefaultfunctionComponent(){const{data: session}=useSession()if(session){return(<>
Signed in as {session.user.email}<br/><buttononClick={()=>signOut()}>Sign out</button></>)}return(<>
Not signed in <br/><buttononClick={()=>signIn()}>Sign in</button></>)}

Share/configure session state

Use the <SessionProvider> to allow instances of useSession() to share the session object across components. It also takes care of keeping the session updated and synced between tabs/windows.

import{SessionProvider}from"next-auth/react"exportdefaultfunctionApp({
Component,pageProps: { session, ...pageProps},}){return(<SessionProvidersession={session}><Component{...pageProps}/></SessionProvider>)}

Security

If you think you have found a vulnerability (or not sure) in NextAuth.js or any of the related packages (i.e. Adapters), we ask you to have a read of our Security Policy to reach out responsibly. Please do not open Pull Requests/Issues/Discussions before consulting with us.

Acknowledgments

NextAuth.js is made possible thanks to all of its contributors.

Support

We're happy to announce we've recently created an OpenCollective for individuals and companies looking to contribute financially to the project!

Vercel Logo
Vercel

🥉 Bronze Financial Sponsor
☁️ Infrastructure Support
Prisma Logo
Prisma

🥉 Bronze Financial Sponsor
Clerk Logo
Clerk

🥉 Bronze Financial Sponsor
Lowdefy Logo
Lowdefy

🥉 Bronze Financial Sponsor
WorkOS Logo
WorkOS

🥉 Bronze Financial Sponsor
Descope Logo
Descope

🥉 Bronze Financial Sponsor
Checkly Logo
Checkly

☁️ Infrastructure Support
superblog Logo
superblog

☁️ Infrastructure Support

Contributing

We're open to all community contributions! If you'd like to contribute in any way, please first read our Contributing Guide.

License

ISC

About

Authentication for the Web.

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages