跳到主内容
返回全部文章

出海独角兽

我把 Google OAuth 凭据填进 Supabase,但还不能说登录成功

真实还原 Google Web OAuth 客户端与 Supabase Provider 配置;开关已启用,但没有登录、Users 和 session 证据。

我把 Google OAuth 凭据填进 Supabase,但还不能说登录成功封面

我这次配置 Google 登录,真实做完的部分停在后台。Google Auth Platform 里创建了 Web OAuth 客户端,Supabase 的 Google Provider 也已经启用。原手册没有应用发起登录、Google 同意页、回到应用、Auth Users 或 session 的记录。

所以先把结论说在前面。Provider 已启用,只能证明配置走到这里;它不是用户已经登录成功。

先把 Google 应用信息走完

我先在 Google Cloud 新建项目,再进入 Google Auth Platform 创建应用信息。截图里填写过应用名称和用户支持邮箱,随后把受众群体选为“外部”,继续填写联系邮箱并同意 Google API 服务的用户数据政策。

当时把受众群体选为外部

这一步解决的是谁可以进入 OAuth 测试流程。它还不会产生可交给 Supabase 的 Client ID 和 Client Secret。

创建 Web OAuth 客户端

应用信息完成后,我进入“客户端”,点击创建 OAuth 客户端,应用类型选择 Web 应用。

进入 Google OAuth 客户端创建入口

原截图里,我给客户端填了名称,并把一条 Supabase 项目的回调地址放进“已获授权的重定向 URI”。完整地址含项目标识,本文只保留脱敏裁图。

Supabase Callback URL 已填进重定向 URI

这里要分清三个东西。Google 生成 Client ID 和 Client Secret;Supabase Callback URL 填在 Google 的 Authorized redirect URIs;应用登录后最终回哪里,则由 Supabase 的 Site URL、Redirect URLs 和代码中的 redirectTo 控制。三者不能互换。

当前 Supabase 官方文档还要求 Web 应用在 Google 的 Authorized JavaScript origins 中填写应用来源,例如协议、域名和端口。我的历史截图中这一区域看起来没有填值,原文也没有后续补证。因此它是待检查项,不能写成配置完整。

回到 Supabase 启用 Google Provider

我在 Supabase 进入 Authentication 的 Sign In / Providers,找到 Google。

在 Supabase Provider 列表里找到 Google

Google Provider 页面里,Client IDs 字段已经有值,Client Secret 以圆点遮住,顶部 Enable Sign in with Google 开关也处于开启状态。

Supabase 的 Google Provider 开关已经启用

这张图只能证明凭据已经填入、开关已经打开。Secret 不能出现在前端代码、公开仓库或文章截图里;我也没有点击眼睛图标查看它。

真实终点停在 Provider enabled

原手册到这里就结束了。下面四类证据都没有留下。

  • 应用调用 signInWithOAuth
  • Google 授权后回到应用。
  • Supabase Authentication 的 Users 出现测试用户。
  • 应用成功交换 code 并拿到 session。

Supabase 当前文档明确区分两段跳转。Google 把结果送到 Supabase Callback URL;Supabase 再按允许列表把用户送回应用。即使后台开关是绿色,只要应用来源、redirectTo、回调路由或 code exchange 有一处没配好,用户仍然无法完成登录。

因此,这篇的最终状态只能写成“Google OAuth 客户端已创建,Supabase Google Provider 已启用,登录流程待本人实测”。要升级成“接入成功”,至少还要补一轮真实登录,并同时留下回到应用、Auth Users 和有效 session 的证据。

参考资料

如果你也在做 AI 出海、独立开发或海外业务,欢迎关注「出海独角兽🦄」。

这里继续分享工具、收款、增长和运营里能直接照着做的步骤。

出海独角兽

继续记录海外账户、支付接入,以及真实项目里的操作经验。

继续看文章