Node.js+Mongoose登录页面无法跳转问题排查及解决方案

咱们先拆解下你遇到的问题核心：点击登录后浏览器控制台能看到请求成功，但页面就是不跳转，主要问题出在前端AJAX请求的处理逻辑和后端响应方式不匹配上，具体来看：

问题原因 #

1. Fetch请求不会自动触发页面跳转 #

你在前端用fetch发送登录请求，但fetch API的特性是：哪怕后端返回302重定向响应，它只会在后台默默跟随重定向、获取目标页面的内容，不会主动触发浏览器的页面跳转。而且你当前的代码里，fetch请求完成后没有做任何后续处理（then((res)=>res.json())之后就没下文了），自然看不到页面变化。

2. 后端响应逻辑的适配问题 #

后端用res.redirect('/dashboard')返回重定向，这种方式更适合传统的表单默认提交（不带event.preventDefault()的场景），但对于AJAX/fetch这类异步请求，浏览器不会处理重定向响应的页面跳转动作。

另外，后端代码还有个小漏洞：当密码验证失败时，没有返回任何响应（比如错误状态码或提示信息），会导致前端的fetch请求一直处于pending状态，用户完全看不到反馈。

3. 前端分支逻辑的不对称 #

你给admin账号做了直接跳转的逻辑（window.location.href='/libri/list'），但普通用户走fetch请求的分支时，完全没有处理跳转的代码，这也导致了普通用户登录成功后没反应。

解决方案思路 #

方案一：调整前端Fetch的响应处理，手动触发跳转 #

修改前端的loginUser函数，在请求完成后根据后端返回的结果，手动调用window.location.href完成跳转，同时处理登录失败的情况：

async function loginUser(event){
  event.preventDefault();
  const username = document.getElementById('usernameuser').value;
  const password = document.getElementById('passworduser').value;
  
  if(username=='admin' && password==='admin'){
    window.location.href='/libri/list';
  }else{
    try {
      const response = await fetch('/login',{
        method: 'POST',
        headers:{
          'Content-Type':'application/json'
        },
        body: JSON.stringify({ username, password })
      });
      
      if (response.ok) {
        // 接收后端返回的跳转地址，或者直接约定固定地址
        const data = await response.json();
        window.location.href = data.redirectUrl || '/dashboard';
      } else {
        // 登录失败时给用户提示
        const errorInfo = await response.json();
        alert(errorInfo.message || '登录失败，请检查账号密码');
      }
    } catch (err) {
      console.error('请求出错:', err);
      alert('登录请求失败，请稍后重试');
    }
  }
}

方案二：修改后端响应逻辑，返回JSON而非重定向 #

既然用了AJAX请求，后端就没必要返回重定向了，直接返回JSON数据告诉前端登录结果和跳转地址：

router.post('/', async (req,res)=>{
  try {
    const username= req.body.username;
    const password= req.body.password;
    const utente = await User.findOne({ username }).lean();
    
    if (!utente) {
      return res.status(404).json({ message: '用户不存在', redirectUrl: '/dashboard' });
    }
    
    if (password !== utente.password) {
      return res.status(401).json({ message: '密码错误' });
    }
    
    // 生成JWT Token（可以存在cookie或让前端存localStorage）
    const token = jwt.sign(
      { id: utente._id, username: utente.username },
      JWT_SECRET
    );
    // 如果要存在cookie：res.cookie('token', token, { httpOnly: true });
    
    // 返回登录成功的信息和跳转地址
    res.json({ message: '登录成功', redirectUrl: '/dashboard' });
  } catch (err) {
    console.error('登录处理出错:', err);
    res.status(500).json({ message: '服务器内部错误' });
  }
});

额外优化建议 #

• 绝对不要明文存密码：现在你直接用password==utente.password比较明文密码，非常不安全。建议用bcrypt等库对密码做哈希存储，登录时用bcrypt.compare()验证。
• 删掉表单的action="/dashboard"：因为你已经用JS完全接管了表单提交逻辑，留着容易造成混淆。
• 给页面添加错误提示元素：比如在表单下方加个<div id="loginError"></div>，登录失败时把错误信息渲染到这里，比alert更友好。

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