NextAuth.js (version 4.24.14) provides comprehensive authentication solutions for Next.js applications, supporting a wide range of authentication providers including OAuth, email, and credentials. This package is currently in maintenance mode, with active feature development now taking place in Auth.js (v5) under the `@auth/nextjs` package. It receives critical bug fixes and security updates for its v4 branch.
npm install next-authVerified import paths — ran on the pinned version, not inferred.
This code sets up a basic NextAuth.js API route (`pages/api/auth/[...nextauth].ts`) using GitHub as an OAuth provider. It demonstrates provider configuration, the mandatory `secret` environment variable, and a simple session callback.
For new projects or App Router, use `@auth/nextjs`. For existing v4 projects, refer to the Auth.js migration guide if planning to upgrade to v5, as it involves breaking changes.
Upgrade to `next-auth@4.24.14` or later to automatically handle the GitHub `issuer`. Alternatively, for custom GitHub provider configurations, manually add `issuer: 'https://github.com/login/oauth'`.
Generate a strong, random 32-character string (e.g., `openssl rand -base64 32`) and set it as `NEXTAUTH_SECRET` in your environment variables. Consider providing multiple secrets for rotation separated by commas.
For full and idiomatic App Router support, consider migrating to `@auth/nextjs` (Auth.js v5). If staying with v4, ensure all client-side functionalities are correctly marked with `'use client'` and server actions/components are handled appropriately.
Set a strong `NEXTAUTH_SECRET` environment variable (e.g., `NEXTAUTH_SECRET=your_super_secret_string`). This is critical for security.
Ensure that the page initiating the authentication flow is properly rendered with the CSRF token. If a custom sign-in page is used, ensure it correctly renders the CSRF token from `getCsrfToken()`. Clear browser cookies and try again.
Double-check your provider configuration in `[...nextauth].ts` (e.g., `GitHubProvider({ clientId: process.env.GITHUB_ID, ... })`) against the values registered with your OAuth provider (GitHub, Google, etc.). Ensure your callback URL (`AUTH_URL/api/auth/callback/github`) is correctly configured in the OAuth provider settings.Verify that the provider you are trying to use (e.g., `GoogleProvider`) is correctly imported and included in the `providers` array within `authOptions` in your `[...nextauth].ts` file.
No dependency data recorded yet.