Express重定向后页面无数据显示，是否需复用查询代码？

你遇到的这个场景很常见：GET路由通过查询数据库并传递results数据，能正常渲染页面；但POST完成数据插入后直接渲染同一页面，却因为没传必要数据导致页面空白。你担心要复制粘贴查询代码——其实完全不用，有两种更优雅的方案：

方案1：使用Post/Redirect/Get（PRG）模式（推荐） #

这是HTTP开发里的最佳实践，处理完POST请求后不要直接渲染页面，而是重定向到对应的GET路由，让GET路由负责查询数据和渲染工作。这样既避免了代码重复，还能防止用户刷新页面时重复提交表单。

修改你的POST路由代码：

// Post data
router.post('/create', (req, res)=>{
    var {title, status, allowComments, body} = req.body;
    // Execute query
    db.query("INSERT INTO PostSchema (title, status, comments, body) values (?, ?, ?, ?)", [title, status, allowComments, body],(err, results)=>{
        if(err){
            return res.status(500).send(err.message); // 这里要返回错误响应，不能只return err
        } else{
            console.log('Post Created!');
            res.redirect('/'); // 重定向到GET路由，让它去查询数据并渲染页面
        }
    });
});

当POST请求完成后，浏览器会自动向GET的/路由发起请求，你的GET路由会正常查询数据库并传递results数据，页面就能正常显示所有内容了。

方案2：提取数据库查询逻辑为可复用函数 #

如果不想用重定向（比如需要在POST请求里传递创建成功的提示消息），可以把查询所有帖子的逻辑抽成单独函数，在GET和POST路由里复用：

// 提取复用的查询函数
function getAllPosts(callback) {
    db.query("select * from PostSchema", (err, results) => {
        if (err) {
            callback(err, null);
        } else {
            callback(null, results);
        }
    });
}

// GET路由
router.get('/', (req, res)=>{
    getAllPosts((err, results) => {
        if(err){
            return res.status(500).end(err.message);
        } else{
            res.render('admin/posts', { results: results });
        }
    });
});

// POST路由
router.post('/create', (req, res)=>{
    var {title, status, allowComments, body} = req.body;
    db.query("INSERT INTO PostSchema (title, status, comments, body) values (?, ?, ?, ?)", [title, status, allowComments, body],(err, insertResults)=>{
        if(err){
            return res.status(500).send(err.message);
        } else{
            console.log('Post Created!');
            // 调用复用函数获取数据后渲染页面，还能额外传递提示消息
            getAllPosts((err, results) => {
                if(err){
                    return res.status(500).end(err.message);
                } else{
                    res.render('admin/posts', { 
                        results: results, 
                        message: '帖子创建成功！' 
                    });
                }
            });
        }
    });
});

这种方式让代码更易维护，避免了重复的查询逻辑，还能灵活添加额外的页面提示信息。

小提醒 #

你的POST路由里的错误处理有问题：if(err){ return err; } 这种写法不会给客户端返回任何响应，会导致请求一直挂着。一定要像上面的代码一样，返回500状态码和错误信息。

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