spencerpauly/awesome-cursor-skills

adding-auth

Add authentication to a web application using NextAuth.js (Auth.js), including OAuth providers, session management, and protected routes.

查看源码

使用方法

  1. 复制安装命令,在自己的智能体环境安装前先检查源码包。
  2. 从原始文档核对所需工具、凭据和支持的宿主。
  3. 说明输入材料与期望交付物,并对照来源检查输出。
npx skills add https://github.com/spencerpauly/awesome-cursor-skills --skill adding-auth

开始前需了解

  • 安装不包含模型订阅、API 额度或访问文件的权限。
  • 仓库星数和安装量反映活跃情况,不等于独立质量或安全测试。
仓库原始内容

按源仓库内容呈现,保留标题、案例、代码、表格、链接以及原文引用的演示图片。

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
bash
   npm install next-auth@beta
  1. Generate an auth secret
bash
   npx auth secret

This adds AUTH_SECRET to .env.local.

  1. Create the auth config — create auth.ts in the project root:
ts
   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],
   });
  1. Add the route handler — create app/api/auth/[...nextauth]/route.ts:
ts
   import { handlers } from "@/auth";
   export const { GET, POST } = handlers;
  1. Add environment variables for each provider:
   AUTH_SECRET=...
   AUTH_GITHUB_ID=...
   AUTH_GITHUB_SECRET=...
   AUTH_GOOGLE_ID=...
   AUTH_GOOGLE_SECRET=...
  1. Add sign-in/sign-out UI — create components that call the signIn and signOut server actions, or use <Link href="/api/auth/signin">.
  1. Protect routes — use the auth() function in server components or middleware:
ts
   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>;
   }
  1. 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.

按任务相关推荐

来自同一仓库

更多 Skills

全部 Skills