认证

基于密码的身份验证

允许用户使用与其邮箱或手机号关联的密码进行登录。


用户通常期望通过密码登录您的网站。Supabase Auth 帮助您安全地实现基于密码的身份验证,采用安全配置选项和存储验证密码的最佳实践。

用户可以通过电子邮件地址电话号码将密码与其身份关联。

通过电子邮件验证

启用电子邮件和密码认证

电子邮件认证默认已启用。

您可以配置用户是否需要验证电子邮件才能登录。在托管的 Supabase 项目中,此选项默认为开启状态。在自托管项目或本地开发环境中,此选项默认为关闭状态。

对于托管项目,您可以在认证提供者页面更改此设置;对于自托管项目,则需修改配置文件

通过邮箱和密码注册

邮箱注册有两种流程:隐式流程PKCE流程。如果您使用服务端渲染(SSR),则使用的是PKCE流程。如果仅使用客户端代码,默认流程取决于客户端库。JavaScript和Dart默认使用隐式流程,Swift默认使用PKCE流程。

本节说明假设已启用邮箱确认功能。

隐式流程仅适用于纯客户端应用。用户确认邮箱后,您的网站会直接收到访问令牌。

要注册用户,调用signUp()并传入邮箱地址和密码。

您可以选择指定用户点击确认链接后的重定向URL。此URL必须配置为重定向URL,托管项目可在仪表盘中配置,自托管项目可在配置文件中配置。

如果不指定重定向URL,用户会自动重定向到您的站点URL。默认为localhost:3000,但也可以配置。

1
2
3
4
5
6
7
8
9
async function () { const { , } = await ..({ : 'valid.email@supabase.io', : 'example-password', : { : 'https://example.com/welcome', }, })}

使用邮箱和密码登录

当用户登录时,调用 signInWithPassword() 方法并传入邮箱地址和密码:

1
2
3
4
5
6
async function () { const { , } = await ..({ : 'valid.email@supabase.io', : 'example-password', })}

重置密码

步骤1:创建重置密码页面

创建一个重置密码页面。该页面应允许公开访问。

收集用户的电子邮件地址并请求发送密码重置邮件。指定重定向URL,该URL应指向修改密码页面的地址。此URL需要在您的重定向URL中进行配置。

1
2
3
await ..('valid.email@supabase.io', { : 'http://example.com/account/update-password',})

第二步:创建修改密码页面

在您上一步指定的URL处创建一个修改密码页面。该页面应仅对已认证用户开放。

收集用户的新密码并调用updateUser方法来更新其密码。

1
await ..({ : 'new_password' })

邮件发送

注册确认和密码重置流程需要一个SMTP服务器来发送邮件。

Supabase平台为您提供了一个默认的邮件发送服务供试用。该服务每小时有2封邮件的速率限制,且服务可用性基于最大努力原则。在生产环境中,您应该考虑配置自定义SMTP服务器。

具体操作指南请参阅自定义SMTP配置文档

使用Inbucket进行本地开发

您可以在本地机器上测试邮件流程。Supabase CLI通过Inbucket自动捕获本地发送的邮件。

在终端中运行supabase status命令获取Inbucket URL。在浏览器中访问该URL,按照指引查看您的测试邮件。

手机号验证

当用户使用密码注册时,您可以使用手机号码作为标识符替代电子邮件地址。

这种做法通常不被推荐,因为电信运营商会回收手机号码。任何获得回收号码的人都能访问原用户的账户。为降低此风险,请实施多因素认证(MFA)

启用手机号和密码认证

对于托管的Supabase项目,您可以在认证提供商页面启用手机认证。

对于自托管项目或本地开发环境,请使用配置文件。参考命名空间为auth.sms下的配置变量。

如果您希望用户在注册时验证手机号码,需要设置短信服务提供商。每个提供商都有其特定的配置。支持的提供商包括MessageBird、Twilio、Vonage和TextLocal(社区支持)。

Configuring SMS Providers

使用手机号和密码注册

要注册用户,请调用 signUp() 方法并传入手机号和密码:

1
2
3
4
const { , } = await ..({ : '+13334445555', : 'some-password',})

如果启用了手机验证,用户将收到包含6位验证码的短信,您需要在60秒内完成验证:

您应该向用户展示一个表单用于输入6位验证码,然后连同手机号一起发送到 verifyOtp

1
2
3
4
5
6
7
8
const { : { }, ,} = await ..({ : '+13334445555', : '123456', : 'sms',})

使用手机号和密码登录

调用以下函数,使用用户的手机号和密码进行登录:

1
2
3
4
const { , } = await ..({ : '+13334445555', : 'some-password',})