EasyStarter logoEasyStarter
认证服务

社媒登录

配置 GitHub OAuth 和 Google OAuth 社媒登录

社媒登录

EasyStarter 内置了以下社媒登录方式:

  • GitHub OAuth 登录
  • Google OAuth 登录

服务端配置位于 apps/server/src/lib/auth.ts。其中:

  • GitHub 回调地址:{SERVER_URL}/api/auth/callback/github
  • Google 回调地址:{SERVER_URL}/api/auth/callback/google

所需环境变量

GITHUB_CLIENT_ID=
GITHUB_CLIENT_SECRET=
GOOGLE_CLIENT_ID=
GOOGLE_CLIENT_SECRET=

创建 GitHub OAuth App

GitHub OAuth 用于网页端和原生端的 GitHub 登录。

GitHub 开发者后台: GitHub Developer Settings

  1. 登录 GitHub,进入 Settings
  2. 打开 Developer settings
  3. 进入 OAuth Apps
  4. 点击 New OAuth App
  5. 填写应用信息

关键字段建议这样填:

  • Application name:你的产品名
  • Homepage URL:你的前端地址,例如 https://yourdomain.com
  • Authorization callback URLhttps://yourdomain.com/api/auth/callback/github

例如你的服务端地址是:

SERVER_URL=https://server.yourdomain.com

那么这里就应该填写:

https://server.yourdomain.com/api/auth/callback/github

开发环境下,easystarter 默认服务端地址是 http://localhost:3001,所以这里通常填写:

http://localhost:3001/api/auth/callback/github

创建完成后你会拿到:

  • Client ID -> 对应 GITHUB_CLIENT_ID
  • Client Secret -> 对应 GITHUB_CLIENT_SECRET

创建 Google OAuth Client

Google OAuth 用于网页端和原生端的 Google 登录。

Google Cloud 控制台: Google Cloud Console

  1. 登录 Google Cloud Console
  2. 选择或新建一个项目
  3. 进入 APIs & Services > Credentials
  4. 点击 Create Credentials
  5. 选择 OAuth client ID
  6. 如果系统要求,先完成 OAuth consent screen
  7. 应用类型选择 Web application
  8. 配置允许的来源和回调地址

关键字段这样填:

  • Authorized JavaScript origins:你的域名地址,例如 https://yourdomain.com
  • Authorized redirect URIshttps://yourdomain.com/api/auth/callback/google

例如你的服务端地址是:

SERVER_URL=https://server.yourdomain.com

那么这里就应该填写:

  • Authorized JavaScript origins:你的域名地址,例如 https://server.yourdomain.com
  • Authorized redirect URIshttps://server.yourdomain.com/api/auth/callback/google

开发环境下,easystarter 默认服务端地址是 http://localhost:3001,所以这里通常填写:

创建完成后你会拿到:

  • Client ID -> 对应 GOOGLE_CLIENT_ID
  • Client Secret -> 对应 GOOGLE_CLIENT_SECRET

填入环境变量

本地开发建议统一放到 apps/server/.dev.vars

apps/server/.dev.vars
GITHUB_CLIENT_ID=your-github-client-id
GITHUB_CLIENT_SECRET=your-github-client-secret
GOOGLE_CLIENT_ID=your-google-client-id
GOOGLE_CLIENT_SECRET=your-google-client-secret

生产部署时,敏感值放到 apps/server/.env.production

apps/server/.env.production
GITHUB_CLIENT_SECRET=your-github-client-secret
GOOGLE_CLIENT_SECRET=your-google-client-secret

然后在 apps/server/wrangler.jsoncvars 中,把非敏感的 GITHUB_CLIENT_IDGOOGLE_CLIENT_ID 填进去:

apps/server/wrangler.jsonc
"vars": {
  "GITHUB_CLIENT_ID": "your-github-client-id",
  "GOOGLE_CLIENT_ID": "your-google-client-id"
}

扩展更多登录方式

如果后续你要扩展更多登录方式,例如 Apple、Discord、GitLab,通常也是继续在 apps/server/src/lib/auth.ts 中追加 socialProviders 配置。