# Crushlevel Next.js Application 这是一个基于 Next.js 的现代化Web应用,支持多种社交登录方式。 ## 功能特性 - 🎮 **多平台社交登录**: 支持Discord、Google登录 - 🔐 **完整认证流程**: OAuth2.0认证,JWT token管理 - 📱 **设备管理**: 自动设备ID生成和管理 - 🛡️ **中间件保护**: 路由级别的认证保护 ## 快速开始 ### 1. 安装依赖 ```bash pnpm install ``` ### 2. 环境变量配置 复制 `.env.local.example` 文件为 `.env.local` 并配置相应的环境变量: ```bash cp .env.local.example .env.local ``` #### Discord OAuth 配置 要启用Discord登录,你需要在Discord开发者平台创建应用: 1. 访问 [Discord Developer Portal](https://discord.com/developers/applications) 2. 点击 "New Application" 创建新应用 3. 在应用设置页面: - 复制 **Application ID** 作为 `NEXT_PUBLIC_DISCORD_CLIENT_ID` - 在 "OAuth2" 标签页生成 **Client Secret** 作为 `DISCORD_CLIENT_SECRET` - 添加回调URL: `http://localhost:3000/api/auth/discord/callback` (开发环境) - 选择 scopes: `identify`, `email` ```env # Discord OAuth 配置 NEXT_PUBLIC_DISCORD_CLIENT_ID=your_discord_client_id_here DISCORD_CLIENT_SECRET=your_discord_client_secret_here # 应用URL(生产环境需要修改) NEXT_PUBLIC_APP_URL=http://localhost:3000 ``` #### 其他OAuth配置(可选) ````env # Google OAuth(未来支持) NEXT_PUBLIC_GOOGLE_CLIENT_ID=your_google_client_id_here ### 3. 启动开发服务器 ```bash pnpm run dev ```` 应用将在 http://localhost:3000 启动。 ## Discord登录流程 ### 1. 用户点击Discord登录按钮 - 系统生成随机state参数用于安全验证 - 跳转到Discord授权页面 ### 2. Discord授权 用户在Discord页面授权后,Discord重定向到回调URL并携带授权码 ### 3. 回调处理 - API路由 `/api/auth/discord/callback` 接收授权码 - 将授权码作为URL参数重定向到前端登录页面 ### 4. 前端登录处理 - 前端登录页面检测到URL中的`discord_code`参数 - 使用授权码调用后端API: `POST /web/third/login` - 后端验证授权码并返回认证token ### 5. 登录完成 - 前端保存token并重定向到首页 - 完成整个登录流程 ## API文档 ### 认证相关API #### 第三方登录 ``` POST /web/third/login Content-Type: application/json { "appClient": "WEB", "deviceCode": "设备唯一码", "thirdToken": "第三方授权码", "thirdType": "DISCORD" | "GOOGLE" | "APPLE" } ``` #### 获取用户信息 ``` GET /web/user/base-info Headers: AUTH_TK: "认证token" AUTH_DID: "设备ID" ``` #### 登出 ``` POST /web/user/logout Headers: AUTH_TK: "认证token" AUTH_DID: "设备ID" ``` ## 许可证 本项目采用 MIT 许可证。详见 [LICENSE](LICENSE) 文件。