ARTICLE DETAIL

资讯详情

深耕编程入门与网站建设的一线实战洞察。

Supabase Auth 怎么开启 Passkey(WebAuthn)无密码登录并配置 Relying Party?

Supabase Auth 怎么开启 Passkey(WebAuthn)无密码登录并配置 Relying Party? Supabase Auth 怎么开启 PasskeyWebAuthn无密码登录并配置 Relying Party【免费下载链接】supabaseThe Postgres development platform. Supabase gives you a dedicated Postgres database to build your web, mobile, and AI applications.项目地址: https://gitcode.com/GitHub_Trending/supa/supabase如果你的项目想让最终用户用设备生物识别、PIN 或安全密钥代替密码登录就需要在 Supabase Auth 上开启 Passkey基于 WebAuthn 标准的无密码凭证并正确配置 Relying PartyRP即你的应用作为密钥归属方。完整流程是先在服务端Dashboard、CLI 或 Management API 三选一开启 Passkey 并填写 RP 三要素再在客户端显式开启实验性 API然后注册一个 passkey 并走一次无密码登录最后验证配置已生效。需要先把边界说清楚Passkey 支持目前是实验性功能ExperimentalAPI 可能随时变更且客户端创建时必须显式 opt-in。客户端库版本要求supabase/supabase-jsv2.105.0 及以上、supabase_flutterv2.15.0 及以上或supabase-swiftv2.48.0 及以上。前提条件与 RP 配置的规则在动手之前先确认这些约束它们是源文档明确给出的注册 passkey 的前提用户必须已登录、邮箱或电话已验证confirmed且不是匿名用户。登录的前提用户已注册过 passkey邮箱或电话已验证且账户未被封禁banned。Supabase Auth 使用 discoverable credentials登录时用户无需提供邮箱、电话或用户名认证器直接从存储的凭据解析出账户。Relying Party ID应用的光板域名例如example.com不要带 scheme、端口或路径。它决定了哪些 passkey 可用。Relying Party Origins逗号分隔的允许来源列表例如https://example.com,https://app.example.com最多 5 个。除回环地址localhost、127.0.0.1、[::1]外必须使用 HTTPS每个 origin 的主机名必须与 RP ID 相同或为其子域名。Android 原生应用可以用形如android:apk-key-hash:签名证书的 base64url SHA-256的 app origin。Relying Party Display Namepasskey 提示时展示给用户的可读名称例如 My App。Admonition 等效提示RP ID 一旦变更所有已注册的 passkey 全部失效因为 passkey 在密码学上绑定到注册时的 RP ID。用户在开始注册前就要想好 RP ID之后保持稳定。服务端开启 Passkey 并配置 Relying Party三种方式任选其一即可配置的是同一份服务端状态。主路径Dashboard在 Supabase 项目的Authentication → Passkeys设置页中打开Enable Passkey authentication开关并填写上面三个 RP 字段。Dashboard 会用项目的 Site URL 和项目名预填这些值——如果生产环境应用部署在不同域名下需要手动改成生产域名。替代路径CLI本地 Supabase 项目在supabase/config.toml中添加[auth.passkey] enabled true [auth.webauthn] rp_display_name My App rp_id example.com rp_origins [https://example.com, https://app.example.com]注意当auth.passkey.enabled为true时[auth.webauthn]一节是必填的。把示例值换成你自己应用的域名和名称。替代路径Management API适合程序化或跨项目批量配置。先从 Supabase Dashboard 的账户 tokens 页拿到 Access Token下面两条命令中的your-access-token和your-project-ref替换为你的实际值# Get your access token from https://supabase.com/dashboard/account/tokens export SUPABASE_ACCESS_TOKENyour-access-token export PROJECT_REFyour-project-ref # Read the current passkey configuration curl -X GET https://api.supabase.com/v1/projects/$PROJECT_REF/config/auth \ -H Authorization: Bearer $SUPABASE_ACCESS_TOKEN \ | jq {passkey_enabled, webauthn_rp_id, webauthn_rp_display_name, webauthn_rp_origins} # Enable passkeys and set the WebAuthn relying party curl -X PATCH https://api.supabase.com/v1/projects/$PROJECT_REF/config/auth \ -H Authorization: Bearer $SUPABASE_ACCESS_TOKEN \ -H Content-Type: application/json \ -d { passkey_enabled: true, webauthn_rp_display_name: My App, webauthn_rp_id: example.com, webauthn_rp_origins: https://example.com,https://app.example.com }GET 命令同时就是你配置后的核对手段返回的passkey_enabled、webauthn_rp_id、webauthn_rp_display_name、webauthn_rp_origins应与预期一致。客户端启用 Passkey API服务端开启之后客户端还要显式启用或满足各 SDK 的对应条件。JavaScript主路径supabase/supabase-jsv2.105.0import { createClient } from supabase/supabase-js const supabase createClient(supabaseUrl, supabaseKey, { auth: { experimental: { passkey: true }, }, })supabaseUrl、supabaseKey替换为你项目的 URL 和 anon key。Dartsupabase_flutterv2.15.0不需要 opt-in 标志方法以experimental标注analyzer 会按预览 API 提示。但需要自己引入一个 passkey 插件并提供 authenticator例如passkeys插件2.21.0起的PasskeyAuthenticator实现了这些方法期望的PasskeyAuthenticatorInterfaceimport package:passkeys/authenticator.dart; final authenticator PasskeyAuthenticator();Dart SDK 替你完成 WebAuthn 仪式的服务端部分把平台弹窗FaceID/TouchID/安全密钥委托给你提供的 authenticator。平台侧配置iOS/macOS 的 Associated Domains、Android 的 Digital Asset Links、Web 的index.html引入 passkeys web SDK需在应用工程中自行完成。Swiftsupabase-swiftv2.48.0Passkey 能力在_spi(Experimental)后面在每个使用 passkey API 的文件顶部加_spi(Experimental) import SupabaseSupabaseClient本身无需额外配置。Associated Domains 权限和带 HTTPS 的 RP 服务器需要在 Xcode 工程中自行配置。注册 passkey第一次无密码凭证落地用户必须先登录才能注册 passkey典型调用位置是安全设置页或注册完成之后。JS 端const { data, error } await supabase.auth.registerPasskey() if (error) { // User cancelled, browser doesnt support WebAuthn, or verification failed console.error(error) } else { console.log(Registered passkey, data.id) }registerPasskey()会跑完整仪式向 Supabase Auth 取 challenge、调起平台 passkey API、把签名响应送回服务端验证。成功时返回新凭据的元数据{ id: string // UUID — use this to update or delete the passkey friendly_name?: string // Derived from the authenticators AAGUID created_at: string }friendly_name自动从认证器的 AAGUID 派生例如iCloud Keychain、Google Password Manager、1Password之后用户可以改名friendlyName限 120 字符。Dart 和 Swift 的一键调用final Passkey passkey await supabase.auth.registerPasskey(authenticator);let passkey try await supabase.auth.registerPasskey( presentationAnchor: view.window! )Swift 的registerPasskey/signInWithPasskey要求 iOS 16、macOS 13 或 visionOS 1。如果不需要 SDK 封装好的仪式、要自定义 UI 或对接原生 WebAuthn 库可以用底层两步 API可选分支startRegistration()/verifyRegistration()、startAuthentication()/verifyAuthentication()start 方法返回的options与 WebAuthn 的PublicKeyCredentialCreationOptions/PublicKeyCredentialRequestOptions结构一致ArrayBuffer字段以 base64url 编码const { data: options } await supabase.auth.passkey.startRegistration() // Run the WebAuthn ceremony yourself (e.g.: using a native WebAuthn library) const credential await runRegistrationCeremony(options.options) await supabase.auth.passkey.verifyRegistration({ challengeId: options.challenge_id, credential, })用 passkey 登录const { data, error } await supabase.auth.signInWithPasskey() if (error) { console.error(error) } else { // data.session and data.user are set; the client also dispatches a SIGNED_IN event console.log(Signed in as, data.user?.email) }登录走 discoverable credential 流程用户在认证器的 UI 里选账户应用不需要预先索要邮箱或电话。成功后data.session和data.user就绪客户端同时派发SIGNED_IN事件。验证配置已生效按部署方式选择对应的验证手段Hosted 项目用上面的 Management API GET 命令回读配置确认passkey_enabled为true、三个webauthn_*字段与预期一致然后按“注册 → 登录”各走一遍error为空、返回data.id/data.session即整条链路打通。自托管Self-hosted项目Passkey 通过docker-compose.yml中传给 auth 服务的环境变量配置与 hosted 的 Dashboard/Management API 不是同一条路径Management API 指向api.supabase.com自托管环境不可用。在auth服务下添加services: auth: environment: # ... existing variables ... GOTRUE_PASSKEY_ENABLED: true GOTRUE_PASSKEY_MAX_PASSKEYS_PER_USER: 10 # optional - default is 10 GOTRUE_WEBAUTHN_RP_ID: example.com GOTRUE_WEBAUTHN_RP_DISPLAY_NAME: my-app GOTRUE_WEBAUTHN_RP_ORIGINS: https://example.com,https://app.example.com GOTRUE_WEBAUTHN_CHALLENGE_EXPIRY_DURATION: 5m # optional - default is 5 minutes其中GOTRUE_WEBAUTHN_RP_ID、GOTRUE_WEBAUTHN_RP_DISPLAY_NAME、GOTRUE_WEBAUTHN_RP_ORIGINS在开启 passkey 时必填规则与 hosted 一致。本地测试可用GOTRUE_WEBAUTHN_RP_ID: localhost配合 originhttp://localhost:3000。修改后需要重建 auth 容器使配置生效该命令会重建 auth 容器期间 auth 服务短暂中断sh run.sh recreate auth验证请求一个认证 challenge把your-domain和 publishable key 换成实际值curl -X POST http://your-domain/auth/v1/passkeys/authentication/options \ -H apikey: your-supabase-publishable-key返回200且响应中含challenge_id说明 passkey 认证已启用返回passkey_disabled说明 auth 服务没有读到新配置。服务端管理侧也可以用 admin API 查看/吊销某个用户的 passkey需要 secret key只能在可信服务端调用例如自托管下的列表接口curl http://your-domain/auth/v1/admin/users/{user_id}/passkeys \ -H apikey: your-supabase-secret-key常见错误码代码含义passkey_disabled该项目未开启 passkey 登录too_many_passkeys用户已达到每账户允许的 passkey 数量上限webauthn_credential_exists该认证器已注册到该账户webauthn_credential_not_foundassertion 中的凭据未在 Supabase Auth 注册webauthn_challenge_not_foundchallenge ID 未知或已被消费webauthn_challenge_expired客户端返回凭据前 challenge 已过期webauthn_verification_failed签名、attestation 或 assertion 未通过验证另外signInWithPasskey()还会返回常规登录失败模式email_not_confirmed、phone_not_confirmed、user_banned。限制与下一步SSO 用户无法注册 passkey匿名用户也无法注册需要先关联邮箱或电话。再次强调 RP ID 变更会作废所有存量 passkey用户需要重新注册。服务端开启后客户端侧的注册与登录配置方式和 hosted 项目完全一致自托管场景亦如此。更多 API 细节可查仓库中的两篇源文档Passkey authentication 指南 与 自托管 Passkey 配置指南。【免费下载链接】supabaseThe Postgres development platform. Supabase gives you a dedicated Postgres database to build your web, mobile, and AI applications.项目地址: https://gitcode.com/GitHub_Trending/supa/supabase创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表