Express中res.sendFile加载HTML失败的登录流程问题

你的核心问题在于用AJAX请求处理服务器端重定向——AJAX是异步HTTP请求，它会接收服务器返回的重定向响应（3xx状态码），但不会触发浏览器的页面跳转，这就是为什么res.redirect('/homepage')看起来没起作用的原因。另外，你的/homepage路由里还有个小问题：req.status不是正确的属性，中间件应该把用户验证结果放在其他自定义属性里。

下面是具体的修复方案：

1. 前端AJAX逻辑调整：去掉多余的/reroute请求，直接前端跳转 #

既然已经拿到了token并存入localStorage，完全不需要再发一次AJAX去请求重定向，直接在第一个AJAX的success回调里让浏览器跳转即可。这样浏览器会发起全新的GET请求到/homepage，服务器的验证和页面返回逻辑就能正常工作。

修改后的前端代码：

$(document).on("click", "#login", (e) => { 
    const email = $('#logemail').val().trim(); 
    const pass = $('#password').val().trim(); 
    $.ajax({ 
        url: "http://localhost:4000/checkuserexists", 
        type: "POST", 
        dataType: "JSON", 
        data: { email: email, pass: pass }, 
        success: function(data, textStatus, request) { 
            console.log(data) 
            if (data.message === "authorised") { 
                const token = request.getResponseHeader('access-token'); 
                localStorage.setItem("access-token", token); 
                // 直接让浏览器跳转至首页，替代AJAX请求重定向
                window.location.href = "http://localhost:4000/homepage";
            } else { 
                $('.alertbox').show(); 
                $('.alertbox').text("User unauthorised"); 
            } 
        } 
    }) 
})

2. 修正/homepage路由的用户验证判断 #

你的token_middleware应该是用来验证JWT并判断用户是否存在的，它不太可能把结果存在req.status（这是HTTP响应状态码的内置属性），通常会自定义一个属性，比如req.user或者req.isAuthorized。假设你的中间件验证通过后会设置req.isAuthorized = true，修改路由代码：

const express = require('express'); 
const path = require('path'); 
const token_middleware = require('../middlewares/jwtauth'); 
const router = express.Router(); 
router.use(express.static(path.join(__dirname, "../public"))) 

router.get('/', token_middleware, (req, res) => { 
    // 替换成中间件实际设置的授权标识属性
    if (req.isAuthorized || req.user) { 
        res.sendFile(path.join(__dirname, "../public/homepage.html")); 
    } else { 
        res.redirect('/'); 
    } 
}) 

module.exports = router;

3. 可选：移除/reroute路由（如果不再需要） #

既然已经通过前端直接跳转，/reroute路由就没有存在的必要了，可以直接删除它，简化你的路由结构。

额外提示 #

• 确保你的token_middleware在验证token时，会从请求头（req.header('access-token')）获取token并验证，验证通过后给req添加对应的授权标识。
• 前端跳转后，新的请求需要携带token到服务器，你可以通过全局AJAX配置自动添加请求头，比如用jQuery的$.ajaxSetup：

  $.ajaxSetup({
      beforeSend: function(xhr) {
          xhr.setRequestHeader('access-token', localStorage.getItem('access-token'));
      }
  });
  

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