Node.js中req.query.token为undefined的密码重置问题求助

核心问题原因 #

用户点击邮件中的重置链接时，token和email参数附在URL查询字符串里，但表单提交时默认只发送表单内输入字段的数据，不会自动携带当前页面URL的查询参数，导致后端req.query.token和req.query.email返回undefined。

解决方案一：使用隐藏表单字段（推荐） #

这是最安全且常用的方式，将token和email作为隐藏字段嵌入表单，提交时随表单数据一起发送到后端。

步骤1：处理重置页面的GET请求 #

新增GET路由渲染密码重置页面，接收URL中的token和email参数并传递给页面模板：

router.get('/reset-password', (req, res) => {
  const { token, email } = req.query;
  // 渲染重置页面，将参数传入模板（语法根据你使用的模板引擎调整）
  res.render('reset-password', { token, email });
});

步骤2：修改表单代码，添加隐藏字段 #

在表单中加入两个隐藏输入框，填充token和email的值：

<form action="/auth/reset-password" method="POST">
  <!-- 隐藏字段传递token和email -->
  <input type="hidden" name="token" value="<%= token %>">
  <input type="hidden" name="email" value="<%= email %>">

  <div class="form-group">
    <!-- 修正：type应为password，而非password1 -->
    <input type="password" id="newPassword" name="password" class="form-control" placeholder="新密码" required>
  </div>
  <div class="form-group">
    <!-- 修正：type应为password，而非password2 -->
    <input type="password" id="newPasswordConfirm" name="passwordConfirm" class="form-control" placeholder="确认新密码" required>
  </div>
  <button type="submit" name="submit" class="btn btn-theme btn-block btn-form">确认</button>
</form>

步骤3：调整后端处理逻辑 #

后端从req.body中获取参数（POST请求的表单数据存于请求体）：

exports.resetPassword = async (req, res, next) => {
    const { token, email, password, passwordConfirm } = req.body;
    console.log(token);
    console.log(email);
    // 后续密码重置逻辑...
};

解决方案二：动态修改表单的Action URL #

若不想使用隐藏字段，可通过JavaScript在页面加载时，将URL查询参数拼接到表单action属性中：

<form id="resetForm" action="/auth/reset-password" method="POST">
  <div class="form-group">
    <input type="password" id="newPassword" name="password" class="form-control" placeholder="新密码" required>
  </div>
  <div class="form-group">
    <input type="password" id="newPasswordConfirm" name="passwordConfirm" class="form-control" placeholder="确认新密码" required>
  </div>
  <button type="submit" name="submit" class="btn btn-theme btn-block btn-form">确认</button>
</form>

<script>
  const urlParams = new URLSearchParams(window.location.search);
  const token = urlParams.get('token');
  const email = urlParams.get('email');
  
  // 转义特殊字符后拼接参数到action
  const resetForm = document.getElementById('resetForm');
  resetForm.action = `/auth/reset-password?token=${encodeURIComponent(token)}&email=${encodeURIComponent(email)}`;
</script>

此方式下后端仍可通过req.query获取参数，但参数会暴露在URL中，安全性弱于隐藏字段，仅作备选。

额外注意事项 #

• 邮件中的重置链接需指向GET渲染页面的路由，而非直接指向POST接口。
• 需对token和email参数做合法性校验，拦截恶意请求。

内容的提问来源于stack exchange，提问作者Boom