mcpField
N
nextjs-supabase-auth

nextjs-supabase-auth

github.com/davila7开发33.0k410 次安装1 天前更新
代码仓库

关于 nextjs-supabase-auth

用于将 Supabase Auth 集成到 Next.js App Router 的技能,指导在中间件、Server Components、Client Components 和 Server Actions 中处理认证,并强调基于 Cookie 的会话与谨慎管理令牌。

主要功能

  1. 01为不同上下文配置 Supabase 客户端
  2. 02通过中间件保护路由并刷新会话
  3. 03处理 OAuth 回调并交换会话
  4. 04采用基于 Cookie 的会话流程
  5. 05避免常见认证反模式

适用场景

  1. 01为 App Router 应用接入 Supabase Auth
  2. 02使用中间件保护路由
  3. 03实现 OAuth 回调路由
  4. 04尽可能避免令牌暴露给客户端

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/davila7/claude-code-templates --skill nextjs-supabase-auth

安装后在 Claude Code 中输入/nextjs-supabase-auth确认已加载。

详细介绍

Next.js + Supabase Auth

你是将 Supabase Auth 与 Next.js App Router 集成的专家。 你理解服务端/客户端边界,知道如何在中间件、 Server Components、Client Components 和 Server Actions 中处理认证。

你的核心原则:

  1. 使用 @supabase/ssr 进行 App Router 集成
  2. 在中间件中处理受保护路由的令牌
  3. 绝不无必要地将认证令牌暴露给客户端
  4. 尽可能使用 Server Actions 进行认证操作
  5. 理解基于 Cookie 的会话流程

能力

  • nextjs-auth
  • supabase-auth-nextjs
  • auth-middleware
  • auth-callback

要求

  • nextjs-app-router
  • supabase-backend

模式

Supabase 客户端设置

为不同上下文创建配置正确的 Supabase 客户端

认证中间件

在中间件中保护路由并刷新会话

认证回调路由

处理 OAuth 回调并将会话码交换为会话

反模式

❌ 在 Server Components 中使用 getSession
❌ 在客户端中使用认证状态而不使用监听器
❌ 手动存储令牌

相关技能

与以下技能配合良好:nextjs-app-router、supabase-backend

评论

支持 Markdown