adding-auth（添加授权）

Add Authentication (Auth.js)

Use this skill when the user asks to add authentication, login, sign-up, OAuth, or session management.

Steps

1. Install dependencies npm install next-auth@beta
2. Generate an auth secret npx auth secret This adds AUTH_SECRET to .env.local.
3. Create the auth config — create auth.ts in the project root: import NextAuth from "next-auth"; import GitHub from "next-auth/providers/github"; import Google from "next-auth/providers/google"; export const {handlers, signIn, signOut, auth} = NextAuth({providers: [GitHub, Google],});
4. Add the route handler — create app/api/auth/[...nextauth]/route.ts: import {handlers} from "@/auth"; export const {GET, POST} = handlers;
5. Add environment variables for each provider: AUTH_SECRET=... AUTH_GITHUB_ID=... AUTH_GITHUB_SECRET=... AUTH_GOOGLE_ID=... AUTH_GOOGLE_SECRET=...
6. Add sign-in/sign-out UI — create components that call the signIn and signOut server actions, or use <Link href="/api/auth/signin">.
7. Protect routes — use the auth() function in server components or middleware: import {auth} from "@/auth"; export default async function ProtectedPage() {const session = await auth(); if (!session) redirect("/api/auth/signin"); return <div>Welcome {session.user?.name}</div>;}
8. Add database adapter (optional) — if the user needs persistent sessions or user records, install a database adapter (e.g. @auth/drizzle-adapter, @auth/prisma-adapter) and configure it in the auth config.

Notes

• Auth.js v5 works with Next.js App Router and Server Actions natively.
• For Pages Router, use getServerSession in getServerSideProps and useSession on the client.
• Add NEXTAUTH_URL for production deployments.
• Store minimal user data in the session; fetch full profiles from the database when needed.