二次学习Express-auth

[原视频链接](Advanced MERN Auth Course: Email Verification, Password Recovery, and Welcome Emails)

初始化项目npm init -y

安装依赖npm install express cookie-parser mailtrap bcryptjs dotenv jsonwebtoken mongoose crypto

安装npm i nodemon -D

之后步骤略……详情请查看另外的文档。

（内容补充）

1. JWT expiresIn（jwt.sign() 中的设置）

1
jwt.sign({ userId }, process.env.JWT_SERCET, { expiresIn: "30d" })
  • 作用：控制 JWT 本身的有效期，即 token 在生成时自带的过期时间。
  • 过期机制：JWT 一旦过期，客户端将无法再用这个 token 进行身份验证。即使 token 被存储在 cookie 或 LocalStorage 中，过期后的 JWT 会失效，用户需要重新登录以获得一个新的有效 token。
  • 生命周期：JWT 的有效期（如设置为 "30d"）由服务器端在生成时确定，并编码在 token 中。这个过期时间是嵌入在 token 内部的，因此是不可篡改的。
1
res.cookie("token", token, { maxAge: 7 * 24 * 60 * 60 * 1000 })
  • 作用：控制 cookie 的有效期，即存储在浏览器中的 token 在 cookie 中存活的时间。
  • 过期机制：设置 maxAge 是告诉浏览器多久后自动删除 cookie（此例为 7 天）。即在这段时间内，浏览器会在每个请求中自动携带 cookie，直到 cookie 过期为止。
  • 生命周期：当 maxAge 设置为 7 天时，浏览器会在 7 天内自动携带这个 cookie，但如果 cookie 在这 7 天内没有过期，客户端的请求会依然携带有效的 token 即使 JWT 已经过期。

区别总结：

  • JWT expiresIn 设置的是 token 本身的过期时间，它控制的是 JWT 的生命周期。JWT 在过期后，无法再进行身份验证，用户需要重新登录。
  • Cookie maxAge 设置的是 cookie 的过期时间，它控制的是 token 在客户端（浏览器）存储的生命周期。即使 JWT token 已经过期，只要 cookie 还没过期，浏览器仍然会携带这个过期的 token。

常见场景：

  • JWT 过期（expiresIn）：当你希望用户登录后，token 有一个固定的有效期（例如 30 天），过期后用户需要重新登录，以增强安全性。
  • Cookie 过期（maxAge）：当你希望控制用户登录状态在客户端的存储时间。例如，设置 7 天后自动过期，7 天内用户无需重新登录，但如果 JWT token 本身过期了，还是会要求重新登录。

例子说明：

  1. 如果 jwt.sign() 中的 expiresIn 设置为 30 天，而 res.cookie() 中的 maxAge 设置为 7 天：
    • 在 7 天内，浏览器会发送 cookie 中的 JWT。
    • 如果用户尝试在 7 天后使用这个 cookie，浏览器会携带过期的 token，但此时由于 JWT 已经过期，服务器会拒绝请求，需要重新登录以获取新的 token。
  2. 如果 maxAge 设置大于 expiresIn：
    • 比如将 cookie 的 maxAge 设置为 30 天，token 的 expiresIn 仍然是 7 天。那么在 cookie 存活的 30 天内，用户会自动发送这个 token，但当 JWT 过期后，用户依然无法访问需要身份验证的资源，必须重新登录。

  • ...user._doc 这个语法是 JavaScript 中的 扩展运算符（Spread Operator），用来展开一个对象的所有属性。

  • e.preventDefault() 是一个常用于事件处理函数中的方法，它的作用是 阻止事件的默认行为。

    在这个例子中，假设 handleSubmit 是一个表单提交事件的处理函数：

    1
    2
    3
    jsconst handleSubmit = async (e) => {
      e.preventDefault();
    };

    e.preventDefault() 的作用是在 提交表单 时，防止页面的默认提交行为（即刷新页面或跳转到表单的 action 指定的 URL）。如果没有 e.preventDefault()，提交表单时浏览器会自动重新加载页面或跳转，而我们可能不希望这样发生，特别是在处理异步操作（比如通过 async/await 发送 API 请求）时。