# 闲言APP — OAuth 社交登录对接指南 > 创建时间: 2026-06-05 > 更新时间: 2026-06-05 > 版本: v1.0 > 状态: 待对接(前端按钮已用 TODO 隐藏) > 关联文档: API_OAUTH_DOC.md --- ## 一、当前状态 | 组件 | 状态 | 说明 | |------|------|------| | 后端 Oauth.php 控制器 | ✅ 已完成 | 已上传服务器,接口测试通过 | | 后端路由配置 | ✅ 已完成 | 6条OAuth路由已注册 | | 数据表 tool_user_oauth | ✅ 已创建 | install接口已验证 | | API文档 | ✅ 已完成 | docs/toolsapi/docs/API_OAUTH_DOC.md | | Flutter OAuthService | ✅ 已完成 | lib/features/auth/services/oauth_service.dart | | Flutter 登录页按钮 | ⏸️ TODO隐藏 | 待OAuth配置完成后启用 | | 各平台OAuth配置 | ❌ 未配置 | 需要在各平台创建应用并获取凭据 | | 服务器数据库配置 | ❌ 未写入 | 需要向 tool_oauth_config 表写入各平台凭据 | **启用按钮位置**: `lib/features/auth/presentation/login_page.dart` 第530行,搜索 `TODO: [OAuth社交登录]` --- ## 二、GitHub 对接(推荐优先配置) ### 2.1 难度:⭐(最简单,无需审核) ### 2.2 前置条件 - GitHub 账号 ### 2.3 操作步骤 1. 打开 https://github.com/settings/developers 2. 点击 **New OAuth App** 3. 填写信息: | 字段 | 值 | |------|-----| | Application name | 闲言工具箱 | | Homepage URL | https://tools.wktyl.com | | Authorization callback URL | https://tools.wktyl.com/oauth/callback | 4. 点击 **Register application** 5. 记录 **Client ID**(页面直接显示) 6. 点击 **Generate a new client secret** → 记录 **Client Secret**(只显示一次!) ### 2.4 写入服务器 ```sql -- 确保 oauth_config 表存在 CREATE TABLE IF NOT EXISTS `tool_oauth_config` ( `id` int(11) unsigned NOT NULL AUTO_INCREMENT, `platform` varchar(30) NOT NULL DEFAULT '', `config` text NOT NULL, `status` tinyint(1) NOT NULL DEFAULT 1, `createtime` int(11) unsigned NOT NULL DEFAULT 0, `updatetime` int(11) unsigned NOT NULL DEFAULT 0, PRIMARY KEY (`id`), UNIQUE KEY `uk_platform` (`platform`) ) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4; -- 写入GitHub配置(替换为实际值) INSERT INTO `tool_oauth_config` (`platform`, `config`, `status`, `createtime`, `updatetime`) VALUES ('github', '{ "client_id": "你的GitHub Client ID", "client_secret": "你的GitHub Client Secret", "redirect_uri": "https://tools.wktyl.com/oauth/callback" }', 1, UNIX_TIMESTAMP(), UNIX_TIMESTAMP()); ``` ### 2.5 Flutter端配置 GitHub登录使用浏览器OAuth流程(`flutter_web_auth`),需要配置: **Android** — `android/app/src/main/AndroidManifest.xml` 添加: ```xml ``` **iOS** — `ios/Runner/Info.plist` 添加: ```xml CFBundleURLTypes CFBundleTypeRole Editor CFBundleURLSchemes xianyan ``` ### 2.6 验证 ```bash curl -s "https://tools.wktyl.com/api/oauth/config?platform=github" | python3 -m json.tool # 期望: configured: true ``` ### 2.7 注意事项 - Client Secret 只在创建时显示一次,务必保存 - GitHub OAuth App 无审核流程,创建即可用 - 回调URL必须完全匹配,包括 http/https - 可同时创建多个 OAuth App(如测试环境和生产环境) --- ## 三、Google 对接 ### 3.1 难度:⭐⭐ ### 3.2 前置条件 - Google 账号 - GCP 项目(免费创建) ### 3.3 操作步骤 #### 步骤1:创建GCP项目 1. 打开 https://console.cloud.google.com/ 2. 顶部项目选择器 → **新建项目** 3. 项目名称:`闲言工具箱` → **创建** #### 步骤2:配置OAuth同意屏幕 1. 左侧菜单 → **APIs & Services** → **OAuth consent screen** 2. 选择 **External** → **Create** 3. 填写: | 字段 | 值 | |------|-----| | App name | 闲言工具箱 | | User support email | 你的邮箱 | | Developer contact email | 你的邮箱 | 4. Scopes 页面 → 添加:`email`、`profile`、`openid` 5. Test users → 添加你的 Gmail(未发布时仅测试用户可用) 6. 完成后点击 **Publish App** 发布(需Google审核1-3天) #### 步骤3:创建3个OAuth凭据 **Android客户端:** 1. **Credentials** → **Create Credentials** → **OAuth client ID** → **Android** 2. Package name: `apps.xy.xianyan` 3. SHA-1: 从签名文件获取 ```bash # debug签名 keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android # release签名 keytool -list -v -keystore 你的keystore文件 -alias 你的别名 ``` **iOS客户端:** 1. **OAuth client ID** → **iOS** 2. Bundle ID: `apps.xy.xianyan` **Web客户端(服务端用,最关键):** 1. **OAuth client ID** → **Web application** 2. Authorized redirect URIs: `https://tools.wktyl.com/oauth/callback` 3. 记录 **Client ID** 和 **Client Secret** #### 步骤4:写入服务器 ```sql INSERT INTO `tool_oauth_config` (`platform`, `config`, `status`, `createtime`, `updatetime`) VALUES ('google', '{ "client_id": "你的Web客户端Client ID.apps.googleusercontent.com", "client_secret": "你的Web客户端Client Secret", "redirect_uri": "https://tools.wktyl.com/oauth/callback" }', 1, UNIX_TIMESTAMP(), UNIX_TIMESTAMP()); ``` #### 步骤5:Flutter端配置 **Android** — `android/app/src/main/AndroidManifest.xml` 的 `` 内: ```xml ``` **iOS** — `ios/Runner/Info.plist`: ```xml CFBundleURLTypes CFBundleTypeRole Editor CFBundleURLSchemes 你的反转Client ID ``` #### 步骤6:验证 ```bash curl -s "https://tools.wktyl.com/api/oauth/config?platform=google" | python3 -m json.tool # 期望: configured: true ``` ### 3.4 注意事项 - Google登录完全免费,无调用次数限制 - 未发布状态仅测试用户可用,发布需审核 - Android端SHA-1必须与签名文件匹配,debug/release不同 - 3个Client ID各有用途:Android/iOS给客户端SDK,Web给服务端 - 写入数据库的是 **Web客户端** 的 Client ID 和 Client Secret --- ## 四、Apple 对接 ### 4.1 难度:⭐⭐⭐ ### 4.2 前置条件 - Apple 开发者账号($99/年) - 仅 iOS 13+ / macOS 10.15+ 可用 ### 4.3 操作步骤 #### 步骤1:开启App的Sign in with Apple能力 1. 打开 https://developer.apple.com/ 2. **Certificates, Identifiers & Profiles** → **Identifiers** 3. 选择 App ID(`apps.xy.xianyan`) 4. 勾选 **Sign in with Apple** → 保存 #### 步骤2:创建Services ID(Web端验证用) 1. **Identifiers** → **Register a Services ID** 2. 填写: - Identifier: `apps.xy.xianyan.service` - 勾选 **Sign in with Apple** - Configure: - Primary App ID: 选择你的 App ID - Domain: `tools.wktyl.com` - Return URL: `https://tools.wktyl.com/oauth/callback` #### 步骤3:创建API Key 1. **Keys** → **Create a Key** 2. 勾选 **Sign in with Apple** 3. 配置:选择你的 App ID 4. 下载 .p8 文件(只能下载一次!) 5. 记录 **Key ID** 和 **Team ID**(Account页面查看) #### 步骤4:写入服务器 ```sql INSERT INTO `tool_oauth_config` (`platform`, `config`, `status`, `createtime`, `updatetime`) VALUES ('apple', '{ "client_id": "apps.xy.xianyan.service", "team_id": "你的TeamID", "key_id": "你的KeyID", "private_key": "-----BEGIN PRIVATE KEY-----\n你的p8文件内容\n-----END PRIVATE KEY-----", "redirect_uri": "https://tools.wktyl.com/oauth/callback" }', 1, UNIX_TIMESTAMP(), UNIX_TIMESTAMP()); ``` #### 步骤5:Flutter端配置 **iOS** — Xcode中: 1. 打开 `ios/Runner.xcworkspace` 2. **Signing & Capabilities** → **+ Capability** → **Sign in with Apple** 或手动在 `ios/Runner/Info.plist` 添加: ```xml com.apple.developer.applesignin Default ``` **macOS** — 同样需要在 Xcode 中添加 Sign in with Apple 能力。 #### 步骤6:验证 ```bash curl -s "https://tools.wktyl.com/api/oauth/config?platform=apple" | python3 -m json.tool # 期望: configured: true ``` ### 4.4 注意事项 - Apple登录仅iOS 13+和macOS 10.15+可用,Android/Web不支持 - .p8文件只能下载一次,务必安全保存 - Apple不提供用户昵称和头像(仅首次授权时返回全名) - Apple允许用户隐藏邮箱,此时返回的是Apple生成的中转邮箱 - 需要Apple开发者账号(付费$99/年),否则无法使用 --- ## 五、启用前端按钮 配置完成后,在 `login_page.dart` 中搜索 `TODO: [OAuth社交登录]`,取消注释即可: ```dart // 将注释代码取消注释,删除 TODO 行 // 第530行附近 ``` 同时需要确保 `pubspec.yaml` 中的依赖已安装: ```yaml sign_in_with_apple: ^6.1.0 # Apple登录 google_sign_in: ^6.2.1 # Google登录 flutter_web_auth: ^0.6.0 # GitHub浏览器OAuth ``` 运行 `flutter pub get` 安装依赖。 --- ## 六、对接检查清单 | 检查项 | GitHub | Google | Apple | |--------|--------|--------|-------| | 平台账号 | ✅ | ✅ | ✅ | | 创建OAuth应用 | ☐ | ☐ | ☐ | | 获取Client ID | ☐ | ☐ | ☐ | | 获取Client Secret | ☐ | ☐ | ☐ | | 配置回调URL | ☐ | ☐ | ☐ | | 写入服务器数据库 | ☐ | ☐ | ☐ | | Flutter端平台配置 | ☐ | ☐ | ☐ | | 接口验证configured:true | ☐ | ☐ | ☐ | | 实际登录测试 | ☐ | ☐ | ☐ | | 取消TODO隐藏按钮 | ☐ | ☐ | ☐ | --- ## 七、测试脚本 已提供测试脚本:`docs/toolsapi/scripts/test_oauth_api.py` ```bash cd /Users/wushu/Documents/trae_projects/project/xianyan python3 docs/toolsapi/scripts/test_oauth_api.py ``` 当前测试结果(10/10通过): - 安装数据表 ✅ - 获取OAuth配置(3个平台) ✅ - 无效参数拒绝 ✅ - 未登录操作拒绝 ✅ --- ## 八、架构说明 ### 后端 - 控制器: `application/api/controller/Oauth.php` - 路由: `application/route.php` → `/api/oauth/*` - 数据表: `tool_user_oauth`(绑定关系)、`tool_oauth_config`(平台配置) - API文档: `docs/toolsapi/docs/API_OAUTH_DOC.md` ### 前端 - 服务层: `lib/features/auth/services/oauth_service.dart` - 登录页: `lib/features/auth/presentation/login_page.dart` - 翻译键: `auth.otherLoginMethods`(14种语言) ### 登录流程 ``` 客户端SDK获取授权码 → OAuthService._loginToServer() → POST /api/oauth/login → 服务端验证授权码 → 查找/创建用户 → 返回Token → 客户端保存Token ``` --- ## 九、安全注意事项 1. **Client Secret 保密**:仅存于服务器数据库,不写入客户端代码 2. **HTTPS强制**:所有OAuth回调必须使用HTTPS 3. **频率限制**:登录接口30次/5分钟,绑定/解绑20次/小时 4. **Token安全**:OAuth access_token/refresh_token 加密存储于数据库 5. **账号关联**:同一openid只能绑定一个闲言账号,邮箱相同自动关联 6. **Apple隐私**:用户可选择隐藏邮箱,需处理中转邮箱场景