编辑“︁Next.js密码重置”︁（章节）

= Next.js密码重置 =

== 介绍 ==  
'''Next.js密码重置'''是用户身份验证系统中的关键功能，允许用户在忘记密码时通过电子邮件或其他验证方式重新设置密码。在Next.js中，这一流程通常涉及以下步骤：  
1. 用户请求重置密码（提供注册邮箱/用户名）。  
2. 服务器生成唯一令牌并发送包含重置链接的邮件。  
3. 用户点击链接，验证令牌有效性。  
4. 用户提交新密码并完成更新。  

此功能依赖[[JWT]]（JSON Web Tokens）或临时令牌、数据库存储以及安全的通信协议（如HTTPS）。

== 实现步骤 ==  

=== 1. 用户请求重置密码 ===  
用户填写邮箱表单，后端验证邮箱是否注册并生成令牌。  

<syntaxhighlight lang="javascript">  
// pages/api/request-reset.js  
import { generateToken } from 'your-auth-library';  
import { sendEmail } from 'your-email-service';  

export default async function handler(req, res) {  
  if (req.method !== 'POST') return res.status(405).end();  

  const { email } = req.body;  
  const user = await db.user.findUnique({ where: { email } });  

  if (!user) return res.status(404).json({ error: 'User not found' });  

  const token = generateToken(); // 例如：crypto.randomBytes(20).toString('hex')  
  await db.passwordReset.create({  
    data: { token, userId: user.id, expiresAt: new Date(Date.now() + 3600000) } // 1小时有效  
  });  

  const resetLink = `https://yourdomain.com/reset-password?token=${token}`;  
  await sendEmail({  
    to: email,  
    subject: 'Password Reset',  
    html: `Click <a href="${resetLink}">here</a> to reset your password.`  
  });  

  return res.status(200).json({ message: 'Email sent' });  
}  
</syntaxhighlight>  

=== 2. 验证令牌 ===  
用户点击邮件链接后，验证令牌是否有效且未过期。  

<syntaxhighlight lang="javascript">  
// pages/api/validate-token.js  
export default async function handler(req, res) {  
  const { token } = req.query;  
  const resetRequest = await db.passwordReset.findFirst({  
    where: { token, expiresAt: { gt: new Date() } }  
  });  

  if (!resetRequest) return res.status(400).json({ error: 'Invalid or expired token' });  
  return res.status(200).json({ valid: true, userId: resetRequest.userId });  
}  
</syntaxhighlight>  

=== 3. 更新密码 ===  
用户提交新密码后，更新数据库并清除令牌。  

<syntaxhighlight lang="javascript">  
// pages/api/update-password.js  
import { hashPassword } from 'your-auth-library';  

export default async function handler(req, res) {  
  const { token, newPassword, userId } = req.body;  

  const hashedPassword = await hashPassword(newPassword);  
  await db.user.update({  
    where: { id: userId },  
    data: { password: hashedPassword }  
  });  

  await db.passwordReset.deleteMany({ where: { userId } });  
  return res.status(200).json({ message: 'Password updated' });  
}  
</syntaxhighlight>  

== 安全注意事项 ==  
* **令牌有效期**：通常设为1小时以内。  
* **HTTPS**：确保所有通信加密。  
* **密码哈希**：使用bcrypt或Argon2存储密码。  
* **速率限制**：防止暴力攻击，例如限制每IP的请求次数。  

== 实际案例 ==  
假设一个电商网站需要密码重置功能：  
1. 用户点击“忘记密码”并输入`user@example.com`。  
2. 系统发送邮件，链接包含令牌如`https://example.com/reset-password?token=abc123`。  
3. 用户提交新密码`newSecurePassword!`，后端验证后更新数据库。  

== 流程图 ==  
<mermaid>  
sequenceDiagram  
    participant User  
    participant Frontend  
    participant Backend  
    participant Database  

    User->>Frontend: Submit email  
    Frontend->>Backend: POST /request-reset  
    Backend->>Database: Store token  
    Backend->>User: Send email  
    User->>Frontend: Click link (with token)  
    Frontend->>Backend: GET /validate-token?token=abc  
    Backend->>Database: Check token  
    Backend->>Frontend: Valid: true  
    Frontend->>User: Show password form  
    User->>Frontend: Submit new password  
    Frontend->>Backend: POST /update-password  
    Backend->>Database: Update password  
    Backend->>Frontend: Success message  
</mermaid>  

== 数学基础 ==  
令牌生成可使用伪随机函数：  
<math>  
\text{Token} = \text{RandomBytes}(n) \Rightarrow \text{HexString}  
</math>  
其中<math>n</math>为字节长度（通常≥16）。  

== 总结 ==  
Next.js密码重置需结合前端表单、后端API和数据库操作，重点在于令牌的安全生成与验证。通过逐步实现请求、验证和更新流程，开发者可为应用添加可靠的密码重置功能。

[[Category:后端框架]]
[[Category:Next.js]]
[[Category:Next.js身份验证与授权]]