Post请求注册成功后重定向，res.sendFile返回文件但浏览器不渲染问题

问题根源 #

1. GET接口状态码设置无效：原代码中res.sendFile之后调用res.status(200)完全没用，因为sendFile已经发送了响应头和内容，后续修改状态码不会生效。如果文件路径错误或发送失败，浏览器会收到错误响应但无提示，导致页面不渲染。
2. 重定向路径解析错误：res.redirect(302, "calendar.html")用了相对路径，浏览器可能会解析成/register.html/calendar.html（基于当前请求路径），导致找不到文件。
3. 数据库操作冗余：单个用户注册用insertMany不合适，应该用insertOne。

方案一：修复重定向逻辑（推荐） #

修改POST请求的重定向路径为绝对路径，同时修复GET接口的响应处理：

app.post("/register.html", async (req, res) => { 
    try { 
        console.log("erve")
        const {Username, Password, Email} = req.body 
        console.log(Username, Password, Email)

        // 单个用户注册用insertOne更合理
        const result = await users.insertOne({
            "Username": Username,
            "Email": Email,
            "Password": Password
        })
        console.log(__dirname);
        // 用绝对路径重定向，确保浏览器正确解析
        res.redirect(302, "/calendar.html") 
    } catch (error) {
        console.log("hi = ", error)
        // 错误状态码用400（请求错误）更合适，201是资源创建成功的状态码
        res.status(400).send(error.message) 
    }
});

app.get("/calendar.html", (req, res)=>{
    console.log("at calendar")
    const filePath = __dirname + "/views/calendar.html";
    // 先设置状态码，通过回调处理发送错误
    res.status(200).sendFile(filePath, (err) => {
        if (err) {
            console.error("发送文件失败:", err);
            res.status(500).send("无法加载页面");
        }
    });
});

方案二：直接在POST请求中渲染页面 #

如果不需要重定向，可以直接在注册成功后发送calendar.html文件：

app.post("/register.html", async (req, res) => { 
    try { 
        console.log("erve")
        const {Username, Password, Email} = req.body 
        console.log(Username, Password, Email)

        const result = await users.insertOne({
            "Username": Username,
            "Email": Email,
            "Password": Password
        })
        console.log(__dirname);
        // 直接发送calendar.html文件，无需触发GET请求
        const filePath = __dirname + "/views/calendar.html";
        res.status(200).sendFile(filePath, (err) => {
            if (err) {
                console.error("发送文件失败:", err);
                res.status(500).send("无法加载页面");
            }
        });
    } catch (error) {
        console.log("hi = ", error)
        res.status(400).send(error.message)
    }
});

// 保留GET接口，支持用户直接访问calendar.html
app.get("/calendar.html", (req, res)=>{
    console.log("at calendar")
    const filePath = __dirname + "/views/calendar.html";
    res.status(200).sendFile(filePath, (err) => {
        if (err) {
            console.error("发送文件失败:", err);
            res.status(500).send("无法加载页面");
        }
    });
});

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