跳过内容

Supabase Apple 登录 - 通用设置

本指南将帮助您将Apple Sign-In与Supabase身份验证集成。Apple Sign-In提供了一个安全、隐私关注的身份验证方法,适用于iOS、Android和Web平台。

在开始之前,请确保您已经:

  1. 创建了一个 Supabase 项目

  2. 阅读了 Apple 登录通用设置 Apple OAuth 凭证设置指南

  3. 遵循各个平台的指南来为您的目标平台设置 Apple OAuth 凭证:

在 Supabase 中启用 Apple OAuth 提供者

标题:在 Supabase 中启用 Apple OAuth 提供者
  1. 前往您的 Supabase 控制台

  2. 点击您的项目

    Supabase 项目选择器
  3. 请前往菜单 Authentication Supabase 身份验证菜单

    点击
  4. 标签 Providers 菜单

    Supabase 服务提供商标签
  5. 找到 Apple 服务提供商

    Supabase Apple 服务提供商
  6. 启用 Apple 服务提供商

    Supabase Apple 服务提供商启用
  7. 填写客户端 ID 配置:

    Supabase Apple 服务提供商客户端 ID
  8. 点击 Save 按钮

    Supabase Apple Provider Save

Voilà,您现在已经启用了 Supabase 认证的 Apple Sign-In 🎉

使用认证助手

标题:使用认证助手

完整实现包括一个辅助函数 authenticateWithAppleSupabase() 该函数处理整个Apple Sign-In流程与Supabase。

  • 该函数:
  • 初始化Apple Sign-In(使用平台特定的配置)
  • 处理身份验证流程(在iOS上为原生,Android/Web上为OAuth重定向)
  • 从Apple中提取身份令牌

文件中找到。

基本使用
import { authenticateWithAppleSupabase } from './supabaseAuthUtils';
const result = await authenticateWithAppleSupabase();
if (result.success) {
console.log('Signed in:', result.user);
// Navigate to your authenticated area
} else {
console.error('Error:', result.error);
}

它是如何工作的

它是如何工作的

辅助函数自动处理平台特有的差异:

  • iOS: 使用本机 Apple Sign-In(无需重定向 URL,自动使用 bundle ID)
  • Android: 使用 OAuth 重定向流程(需要 Service ID)
  • Web: 使用 OAuth 弹出窗口流程(需要 Service ID 和当前页面 URL 作为重定向)

函数返回 Apple 提供的身份令牌,然后使用该令牌与 Supabase 进行身份验证 supabase.auth.signInWithIdToken().