ExpressJS条件渲染页面时ERR_HTTP_HEADERS_SENT错误解决问询

问题说明 #

原本使用Express路由通过req.params参数渲染对应新闻页面，在newsRouter.get('/:news_param', ...)中添加res.redirect('/404')后，访问有效页面时触发Cannot set headers after they are sent to the client错误，需要修复该问题，且出于安全考虑不使用文件系统API。

原始路由代码 #

var express = require('express');

var newsRouter = express.Router();

newsRouter.get('/:news_param', (req, res) => {
    let news_params = '/haberler/' + req.params.news_param;

    req.news_list.forEach((news_obj) => {
        if (news_params == news_obj.news_addr) res.render(req.params.news_param);
    });
});

newsRouter.post('/', (req, res) => {
    res.render('news', { news_fetch_from_database: news_list });
})

newsRouter.use((req, res) => {
    res.render('404_page_news');
});

module.exports = newsRouter;

修改后引发错误的代码 #

newsRouter.get('/:news_param', (req, res) => {
    let news_params = '/haberler/' + req.params.news_param;

    req.news_list.forEach((news_obj) => {
        if (news_params == news_obj.news_addr) res.render(req.params.news_param);
    });

    res.redirect('/404');
});

错误信息 #

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
    at new NodeError (node:internal/errors:387:5)
    at ServerResponse.setHeader (node:_http_outgoing:644:11)
    at ServerResponse.header (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/response.js:767:10)
    at ServerResponse.location (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/response.js:884:15)
    at ServerResponse.redirect (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/response.js:922:18)
    at /home/alimkoca/Softwares/szal_web/news.js:12:9
    at Layer.handle [as handle_request] (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/router/layer.js:95:5)
    at next (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/router/route.js:137:13)
    at Route.dispatch (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/router/route.js:112:3)
    at Layer.handle [as handle_request] (/home/alimkoca/Softwares/szal_web/node_modules/express/lib/router/layer.js:95:5)

问题根源 #

当找到匹配的新闻地址时，res.render()已经向客户端发送了完整的响应（包括响应头和页面内容），但forEach循环结束后，代码继续执行res.redirect('/404')，尝试再次发送响应头，违反了HTTP协议中一个请求只能对应一个响应的规则，因此触发错误。

修复方案 #

方案1：使用find方法（推荐） #

用find替代forEach，找到匹配项后立即渲染页面并终止函数，避免后续代码执行：

newsRouter.get('/:news_param', (req, res) => {
    let news_params = '/haberler/' + req.params.news_param;
    // 查找匹配的新闻对象，找到后立即停止遍历
    const matchedNews = req.news_list.find(news_obj => news_params === news_obj.news_addr);
    
    if (matchedNews) {
        // 匹配成功则渲染页面，return确保后续重定向代码不执行
        return res.render(req.params.news_param);
    }
    
    // 未匹配到才执行404重定向
    res.redirect('/404');
});

方案2：使用标志变量控制流程 #

如果坚持用forEach，可以通过标志变量判断是否已发送响应，避免重复操作：

newsRouter.get('/:news_param', (req, res) => {
    let news_params = '/haberler/' + req.params.news_param;
    let isMatched = false;
    
    req.news_list.forEach((news_obj) => {
        if (news_params === news_obj.news_addr) {
            res.render(req.params.news_param);
            isMatched = true;
            // forEach无法直接break，return仅终止当前循环迭代
            return;
        }
    });
    
    // 只有未匹配到的时候才执行重定向
    if (!isMatched) {
        res.redirect('/404');
    }
});

两种方案都能确保一个请求只发送一次响应，解决ERR_HTTP_HEADERS_SENT错误，同时保留通过req.params渲染页面的逻辑，且不需要使用文件系统API。

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