如何修复 err_http_headers_sent

Question

我尝试修复一个错误：[ERR_HTTP_HEADERS_SENT]：发送给客户端后无法设置 headers 但我不知道如何去做吧。我尝试了很多可能性，但都没有用，或者我用错了那个解决方案。

server.js

const express = require('express')
const mysql = require('mysql')
const cors = require('cors')
const app = express()

const parser = express.urlencoded({extended:false})
app.use(cors())
app.set('view engine', 'ejs')
app.use(express.static('public'));

const con = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "",
    database: "expenseapp"
})
con.connect(err=>{
    if(err)
        throw err;
    console.log('connected!');
    
})

let array = [] 

app.get('/',(req,res)=>{
    res.render('index')
    let queryName = "SELECT * from `expenses`";
    con.query(queryName, (err,res)=>{
        if(err)
            throw err
        res.forEach(element => {
            array.push(element)
        });
    })
    res.json(array)
    
})
app.get('/add', (req,res)=>{
    res.render('add')
})
app.post('/add', parser, (req,res)=>{
    let array = [req.body.product, req.body.cost]
    let sqlquery = "INSERT INTO `expenses` (name, cost) VALUES (?)";
    con.query(sqlquery, [array], (err,res)=>{
        if(err)
            throw err
        console.log("saved new product");
    })
    res.render('add')
})

app.listen(PORT, ()=>console.log(`Server's running on PORT ${PORT}`))

app.js

    .then(response => {return response.json()})
    .then(data => console.log(data))
    .catch(err => console.log(err))

目录顺序：

node_modules
public:
___javascripts
   ___app.js
___styles
   ___style.css
views:
___add.ejs
___index.ejs
package-lock.json
package.json
server.js

请告诉我如何解决这个问题。谢谢:)

Answer 1

这个请求处理程序：

app.get('/',(req,res)=>{
    res.render('index')
    let queryName = "SELECT * from `expenses`";
    con.query(queryName, (err,res)=>{
        if(err)
            throw err
        res.forEach(element => {
            array.push(element)
        });
    })
    res.json(array)
    
})

正在调用 res.render() 和 res.json()。其中每一个都尝试发送对请求的响应，而第二个将触发您报告的错误，因为每个请求您只能发送一个响应。目前还不清楚你想要这条路线是什么。如果你想将查询结果传递给模板，那么你会做这样的事情：

app.get('/',(req,res)=>{
    const queryName = "SELECT * from `expenses`";
    con.query(queryName, (err,res)=>{
        if (err) {
            console.log(err);
            res.sendStatus(500);
            return;
        }
        res.render('index', res);   // if res isn't already an array, convert it to an array
    });
});

请注意，这里有几项不同的做法：

在记录错误并发送实际错误响应的查询上添加错误处理。 throw err 在这里没有用。
删除 res.json() 这样我们只发送一个响应而不是两个。
使用您的模板调用 res.render() 并将结果数组传递给它，以便模板 index 可以使用该数据生成页面。
将 res.render() 移到我们实际拥有可用数据的数据库回调中。

如果您打算让这条路线完成与我在这里编写的代码不同的事情，那么请描述这条路线应该做什么。

仅供参考，您不应在任何异步回调中使用 if(err) throw err;。这对您没有任何好处，因为您的代码 none 实际上可以捕获任何异步抛出的异常并对其进行一些智能处理。您需要在所有异步操作中进行真正的错误处理。编写代码时不要跳过该步骤。不要留到以后再说。在设计和首次编写代码时将错误处理视为主要概念。

如何修复 err_http_headers_sent

How to fix err_http_headers_sent

javascript

fetch

node.js

express