login_autolisted
Install: claude install-skill weiyi88/cc-code
# Supabase Auth 通用登录系统实现指南
本 skill 是**与项目无关的通用登录逻辑指南**,适用于任意 Next.js + Supabase 项目。不绑定特定 i18n 框架、不绑定特定语言组合、不绑定特定 UI 库。三大场景全覆盖:
- **登录**:邮箱密码 + OAuth (Google/GitHub)
- **注册**:邮箱 + 验证码 + 密码 + 确认密码
- **修改密码**(忘记密码/未登录):邮箱 + 验证码 + 新密码
**邮件通道**:验证码邮件由 Supabase Auth 触发,经 Supabase 自定义 SMTP 接入 **Resend** 投递(不在代码里调 Resend API,不自造验证码存储)。
---
## Skill 启动流程(显式触发时按此走)
```
Step 1 整理项目当前登录逻辑
读项目 auth 相关代码(auth-modal/回调路由/profile/middleware)
→ 画「项目现状登录逻辑」ASCII 图
Step 2 对比 skill 标准逻辑 vs 项目现状
逐链路差异表: ✅一致 / ⚠️偏离 / ❌缺失
(标准逻辑见下方「三大场景」与 Phase 1-3)
Step 3 环境盘点 + 询问 key
检查: 依赖 / Supabase(URL+anon key, service_role可选)
/ Resend(API Key+发件域名) / OAuth(Client ID+Secret)
/ Dashboard(Confirm email关闭? SMTP配Resend? Redirect URLs? Providers?)
缺什么列清单 → 询问主人提供
Step 4 整理改动清单
输出表: 文件 | 现状 | 目标 | 动作
Step 5 调用 /cc-code:cc-code 执行
按角色串行 PM→Architect→Dev→QA 落地
(本 skill 只整理方案, 执行交 cc-code 工作流)
```
> 本 skill 主体是「标准逻辑 + 实现指南」,供 Step 2 对比、Step 4 改动参考。Step 5 不在本 skill 内写代码,交由 /cc-code:cc-code。
---
## 实现指南流程
```
Phase 0 → Phase 1 → Phase 2 → Phase 3 → Phase 4
环境检查 后端实现 前端UI 回调路由 构建验证
```
---
## Phase 0: 环境检查
### 0.1 检查已有 Supabase 配置
```
扫描:
├── package.json → @supabase/supabase-js 存在?
├── package.json → @supabase/ssr 存在?
├── lib/supabase/client.ts 存在?
├── lib/supabase/server.ts 存在?
├── middleware.ts (或 Next.js 16 的 proxy.ts) → 包含 supabase session 刷新?
├── .env.local → NEXT_PUBLIC_SUPABASE_URL + ANO