认证邮件
身份验证直接与 Payload 提供的邮件功能相关联。这允许你向用户发送验证邮件、密码重置邮件等。虽然 Payload 为这些操作提供了默认的邮件模板,但你可以自定义它们以符合你的品牌风格。
邮件验证
邮件验证强制用户证明他们能够访问用于身份验证的邮箱地址。这有助于减少垃圾账户并确保用户身份的真实性。
要启用邮件验证功能,请在Collection配置中使用 auth.verify
属性:
import type { CollectionConfig } from 'payload'
export const Customers: CollectionConfig = {
// ...
auth: {
verify: true, // highlight-line
},
}
提示: 验证邮件可以完全自定义。更多详情。
以下是可用的配置选项:
选项 | 描述 |
---|---|
generateEmailHTML | 允许覆盖发送给用户的验证账户邮件的HTML内容。更多详情。 |
generateEmailSubject | 允许覆盖发送给用户的验证账户邮件的主题。更多详情。 |
generateEmailHTML
该函数接受一个参数 { req, token, user }
,允许覆盖发送给用户的账户验证邮件中的 HTML 内容。该函数应返回一个支持 HTML 的字符串,可以选择返回完整的 HTML 邮件内容。
import type { CollectionConfig } from 'payload'
export const Customers: CollectionConfig = {
// ...
auth: {
verify: {
// highlight-start
generateEmailHTML: ({ req, token, user }) => {
// 使用提供的 token 让用户验证他们的账户
const url = `https://yourfrontend.com/verify?token=${token}`
return `嘿 ${user.email},点击这里验证你的邮箱: ${url}`
},
// highlight-end
},
},
}
重要提示: 如果你指定了不同的 URL 来发送用户进行邮箱验证(例如应用前端页面等),你需要自行在前端处理调用 Payload REST 或 GraphQL 验证操作,使用提供的 token。在上面的例子中,token 是通过查询参数传递的。
generateEmailSubject
与上述 generateEmailHTML
类似,你也可以自定义邮件的主题。函数参数相同,但只能返回字符串 - 不能包含 HTML。
import type { CollectionConfig } from 'payload'
export const Customers: CollectionConfig = {
// ...
auth: {
verify: {
// highlight-start
generateEmailSubject: ({ req, user }) => {
return `嘿 ${user.email},重置你的密码!`
},
// highlight-end
},
},
}
忘记密码功能
你可以通过 auth.forgotPassword
属性中的以下选项来自定义忘记密码流程的操作方式:
import type { CollectionConfig } from 'payload'
export const Customers: CollectionConfig = {
// ...
auth: {
forgotPassword: {
// highlight-line
// ...
},
},
}
可用的配置选项如下:
选项 | 描述 |
---|---|
expiration | 配置密码重置令牌的有效时长,以毫秒为单位。 |
generateEmailHTML | 允许覆盖发送给尝试重置密码用户的邮件HTML内容。更多详情。 |
generateEmailSubject | 允许覆盖发送给尝试重置密码用户的邮件主题。更多详情。 |
generateEmailHTML
此函数允许覆盖发送给尝试重置密码用户的电子邮件中的 HTML 内容。该函数应返回一个支持 HTML 的字符串,可以是一个完整的 HTML 电子邮件模板。
import type { CollectionConfig } from 'payload'
export const Customers: CollectionConfig = {
// ...
auth: {
forgotPassword: {
// highlight-start
generateEmailHTML: ({ req, token, user }) => {
// 使用提供的 token 允许用户重置密码
const resetPasswordURL = `https://yourfrontend.com/reset-password?token=${token}`
return `
<!doctype html>
<html>
<body>
<h1>这是我的自定义邮件模板!</h1>
<p>你好,${user.email}!</p>
<p>点击下方链接重置密码。</p>
<p>
<a href="${resetPasswordURL}">${resetPasswordURL}</a>
</p>
</body>
</html>
`
},
// highlight-end
},
},
}
重要提示: 如果你指定了不同的 URL 将用户引导至重置密码页面(例如应用前端页面等),你需要在前端自行处理调用 Payload REST 或 GraphQL 的 reset-password 操作,使用提供的 token。在上面的例子中,token 是通过查询参数传递的。
小技巧: 可以使用 HTML 模板创建自定义邮件模板、自动内联 CSS 等。你可以创建一个可复用的函数来标准化从 Payload 发送的所有邮件,使发送自定义邮件更加 DRY(不重复)。Payload 不内置 HTML 模板引擎,因此你可以自由选择自己的方案。
generateEmailHTML
函数接收以下参数:
参数 | 描述 |
---|---|
req | 请求对象 |
token | 为用户生成的用于重置密码的 token |
user | 正在尝试重置密码的用户文档 |
generateEmailSubject
与上述 generateEmailHTML
类似,你也可以自定义邮件的主题。函数参数相同,但只能返回字符串 - 不能返回 HTML。
import type { CollectionConfig } from 'payload'
export const Customers: CollectionConfig = {
// ...
auth: {
forgotPassword: {
// highlight-start
generateEmailSubject: ({ req, user }) => {
return `Hey ${user.email}, reset your password!`
},
// highlight-end
},
},
}
以下是传递给 generateEmailSubject
函数的参数:
Argument | 描述 |
---|---|
req | 请求对象。 |
user | 正在尝试重置密码的用户文档。 |