之前写过详细的怎么给网站接入 Google 登录（传送门），今天把 GitHub 登录也补上。两个加起来，基本覆盖了出海网站最常见的登录方式，技术圈的用户尤其喜欢用 GitHub 登录，感觉更信任一些。
一开始我是直接在自己的 GitHub 账号下建了 OAuth App。App 创建好，功能也跑通了，但测试登录的时候，授权页面上显示的名字是我的个人账号昵称，一看就是个人项目，不够正式。
而且随着项目变多，所有网站的 OAuth App 都挂在个人账号下，管理起来也乱。
所以我改成先建一个 GitHub Organization，OAuth App 挂在 Org 下面。
GitHub → 右上角头像 → Your organizations → New organization
选免费套餐，填个 Org 名字，创建完就有了。
这样有几个好处：授权页面显示的是 Org 名称而不是个人昵称，看起来像一个专业产品而不是个人项目；
而且一个 Org 下可以建多个 OAuth App，每个 App 对应一个网站，各自有独立的 Client ID/Secret 和回调 URL，管理清晰。
建的 Org 名字通用，不绑定具体产品，以后旗下所有项目的 OAuth App 都可以放这里。
在 Org 下创建 OAuth App
进入 Org 页面，路径是：Settings → Developer settings → OAuth Apps。
点 "New OAuth App"，填几个基本信息：
Application name 是产品名，用户授权会看到；
Homepage URL 填网站首页地址；
Authorization callback URL 这个很关键，因为我用的是 Supabase 做登录，回调地址要填 Supabase 的，格式是 https://
怎么去拿到这个回调地址，
这个路径：Supabase Dashboard → Authentication → Sign In / Providers → GitHub
点开 GitHub 那行，页面里会直接显示一个 "Callback URL (for OAuth)"，格式就是：
https://
复制这个地址，填到 GitHub OAuth App 的 Authorization callback URL 里就行。
创建完成后，页面会显示 Client ID，同时需要手动点一下生成 Client Secret，生成后复制保存好，这个 Secret 只显示一次。
配置到项目里
因为我用的是 Next.js + Supabase Auth。拿到 Client ID 和 Secret 之后，去 Supabase Dashboard → Authentication → Sign In / Providers → GitHub，把两个值填进去保存就行了。
然后就可以测试下登录。
撤销授权怎么操作
如果用户想取消对你网站的 GitHub 授权，通用入口是：GitHub → Settings → Applications → Authorized OAuth Apps，找到对应的应用点撤销就行。
Google 登录的接入方式之前写过，感兴趣的可以看这篇：出海建站必备：一次搞懂 Google 登录 2 种接入方式，One Tap 只要 1 步。两个加起来，出海产品的社会化登录基本就齐了。
💡 AI 工具的爆发，让普通人也能快速做出产品。
但如何做？如何变现？如何真正走向海外市场？
👇 想了解更多 AI 编程 & 出海实战信息，扫码添加好友了解更多
🔗 更多教程请访问 ipengtao.com
文章评论