后端 /
OAuth 登录配置教程:Google 和 GitHub
OAuth 可以让访客使用已有的 Google 或 GitHub 账号登录你的 Creght 网站。这里的用户属于你当前网站的项目 Auth 系统,不是 Creght 编辑器成员。你可以基于这些用户继续做会员中心、私密页面、预约、下载、客户门户等功能。
本教程会从完整流程讲起:先在 Google 或 GitHub 创建 OAuth 应用,再把 Client ID、Client Secret 和回调地址填入 Creght,最后让 AI 在页面中生成登录入口。
开始前准备
- 你的网站需要有一个正在使用的 HTTPS 域名,可以是预览域名,也可以是正式自定义域名。
- 你需要能进入 Creght 编辑器里的 Backend / Auth / OAuth Providers。
- 你需要有权限在 Google Cloud Console 或 GitHub Developer Settings 中创建 OAuth 应用。
找到 Creght 回调地址
Creght 的 OAuth 回调地址格式很简单:你自己正在使用的网址地址 + /auth/oauth/callback/{provider}。
例如:
https://your-domain.com/auth/oauth/callback/google
https://your-domain.com/auth/oauth/callback/github
请确保这里填入的网址就是用户当前访问和使用的网站域名。如果你正在使用 https://www.example.com,就不要填预览域名;如果你正在用预览域名测试,就填预览域名。
重要:如果之后更换了网站域名,必须回到 Google、GitHub 等第三方后台,把 OAuth 回调地址改成新的正在使用的域名,否则第三方登录会因为回调地址不匹配而失败。
配置 Google 登录
1. 在 Google 创建 OAuth Client
- 打开 Google Cloud Console,并选择对应项目。
- 先配置 OAuth consent screen,填写应用名称、支持邮箱;如果应用还在测试阶段,添加测试用户。
- 进入 APIs & Services / Credentials,创建 OAuth client。
- 应用类型选择 Web application。
- 在 Authorized JavaScript origins 中添加网站来源,例如
https://your-domain.com。 - 在 Authorized redirect URIs 中添加 Google 回调地址,例如
https://your-domain.com/auth/oauth/callback/google。 - 创建后复制 Client ID 和 Client Secret。
2. 在 Creght 填写 Google Provider
| Creght 字段 | 填写内容 |
|---|---|
| Provider Key | google |
| Display Name | Google |
| Client ID | Google Cloud 里的 Client ID |
| Client Secret | Google Cloud 里的 Client Secret |
| Redirect URL | 和 Google Cloud 中 Authorized redirect URIs 完全一致,例如 https://your-domain.com/auth/oauth/callback/google |
| Issuer | https://accounts.google.com |
| Scopes | openid,profile,email |
| Authorization URL | https://accounts.google.com/o/oauth2/v2/auth |
| Token URL | https://oauth2.googleapis.com/token |
| UserInfo URL | https://openidconnect.googleapis.com/v1/userinfo |
| Status | 启用 |
配置 GitHub 登录
1. 在 GitHub 创建 OAuth App
- 打开 GitHub,进入 Settings / Developer settings / OAuth Apps。
- 点击 New OAuth App。
- Application name 填写网站或品牌名称。
- Homepage URL 填写你的网站域名,例如
https://your-domain.com。 - Authorization callback URL 填写 GitHub 回调地址,例如
https://your-domain.com/auth/oauth/callback/github。 - 注册后复制 Client ID,并生成 Client Secret。
2. 在 Creght 填写 GitHub Provider
| Creght 字段 | 填写内容 |
|---|---|
| Provider Key | github |
| Display Name | GitHub |
| Client ID | GitHub OAuth App 的 Client ID |
| Client Secret | GitHub OAuth App 的 Client Secret |
| Redirect URL | 和 GitHub OAuth App 中 Authorization callback URL 完全一致,例如 https://your-domain.com/auth/oauth/callback/github |
| Issuer | https://github.com |
| Scopes | read:user,user:email |
| Authorization URL | https://github.com/login/oauth/authorize |
| Token URL | https://github.com/login/oauth/access_token |
| UserInfo URL | https://api.github.com/user |
| Status | 启用 |
让 AI 添加登录入口
Provider 启用后,就可以让 Creght AI 在网站里添加登录页面、登录按钮或会员中心。可以直接这样描述:
- 添加一个登录页面,包含 Google 和 GitHub 登录按钮。
- 添加一个会员中心。未登录访客看到所有已启用 OAuth 提供商的登录按钮;已登录用户看到头像、姓名、邮箱和退出按钮。
- 让预约表单必须登录后才能使用。如果访客还没有登录,先显示登录提示。
测试流程
- 使用和回调地址一致的域名打开网站。
- 用无痕窗口打开登录页。
- 点击 Google 或 GitHub,并完成授权。
- 确认第三方平台能正常跳回你网站的
/auth/oauth/callback/{provider}地址,没有出现redirect_uri_mismatch。 - 回到 Creght 的 Backend / Auth / Users,确认已生成新的项目用户。
常见问题
| 问题 | 检查方式 |
|---|---|
redirect_uri_mismatch | 逐字检查 Google/GitHub 里的回调地址是否和 Creght Provider 的 Redirect URL 完全一致,包括 HTTPS、域名、路径和结尾斜杠。 |
| 登录页没有显示 Provider | 确认 Provider 状态是启用,并让 AI 读取已启用的 Auth Providers,而不是手写固定按钮。 |
| 更换域名后无法登录 | 到 Google/GitHub 后台把回调地址改成新域名下的 /auth/oauth/callback/{provider},并同步更新 Creght Provider 的 Redirect URL。 |
| GitHub 预览域名可用,正式域名不可用 | GitHub OAuth App 只能配置一个回调地址,需要为当前正在使用的域名单独创建或修改 OAuth App。 |
| Google 只有自己的账号能登录 | 检查 OAuth consent screen 的发布状态和测试用户设置。 |
安全建议
- 不要把 Client Secret 粘贴到页面代码、公开文档或 AI 对话里,只放在 OAuth Provider 设置中。
- OAuth 回调地址使用 HTTPS 域名。
- Scopes 保持最小化。登录场景下,Google 通常只需要
openid,profile,email,GitHub 通常只需要read:user,user:email。 - 如果 Client Secret 暴露,立即在 Google 或 GitHub 中重新生成,并更新 Creght Provider。
