Can't set headers after they are sent to the client
The “[ERR_HTTP_HEADERS_SENT]: Can't set headers after they are sent to the client” occurs when an express.js application tries to send multiple responses for a single request. To solve the error, make sure the following things:
- Don't send two responses for a single request.
- Don't use res.setHeader() after sending a response.
- Don't call next() after response has been returned from the function body.
Don't send two responses for a single request
Always be careful to send only one response for a single request from the node server. The commonly used functions that send responses are res.redirect(), res.render(), res.send() and res.json().
The common scenario the issue arises when you have multiple conditional checks and send responses inside it. If you have any error in conditional logic, then there is a chance to send multiple responses.
app.get('/', function(req, res){
const message = "Hello world!";
if(message != ""){
res.send(message);
}
// Here throws an error: Can't set headers after they are sent to the client
res.send("No message");
})
In the above code, there is an error in conditional logic which lead to calling the res.send() function twice. This causes the server to throw an error. To solve this issue, you can use return
statement in each and every response send function as given below.
app.get('/', function(req, res){
const message = "Hello world!";
if(message != ""){
return res.send(message);
}
return res.send("No message");
})
This solution is applicable to all response functions including redirect(). render(), send() and json().
Don't use res.setHeader() after sending a response
Make sure you are not using res.setHeader() after sending a response to the client. The res.setHeader() function can only be used before res.redirect(), res.render(), res.send(), res.json() and res.writeHead() functions.
The res.setHeader() sets a single header value for implicit headers. If this header already exists in the to-be-sent headers, then its value will be replaced by a new given value.
You are only allowed to call res.setHeader(name, value) until you call res.writeHead(statusCode). After writeHead() function, the headers are ready for send response. So you can only call res.write(data), and finally res.end(data) after that. If you are calling res.setHeader() after res.writeHead() will throw an error.
Don't call next after a response has been returned from the function body
When you are working on middleware in express, and if the current middleware function does not end the request-response cycle, you must need to call next() to pass control to the next middleware function. Otherwise, the request will be left hanging.
You should make sure that you are not calling next() function after a response has been returned from the function body.
The below middleware function throws an error.
const checkSuperUser = function(req, res, next) {
if (!req.user.isSuperUser) {
res.redirect('/'); //ERROR OCCURS HERE
}
next();
};
To solve the error in above code use return statement in res.redirect('/')
.
const checkSuperUser = function(req, res, next) {
if (!req.user.isSuperUser) {
return res.redirect('/');
}
next();
};
How to check headers are sent or not
You can check res.headersSent to determine whether the header are sent or not. If it is set to true, then the headers have already been sent. You can prevent multiple headers by checking this property of the response.
app.get('/', function(req, res){
res.send('Hello World!');
if(res.headersSent !== true) {
res.send('Hello World!');
}
});
Conclusion
To solve the error “[ERR_HTTP_HEADERS_SENT]: Can't set headers after they are sent to the client”, always make sure you are only sending a single response for a single request. Also, ensure you are not using res.setHeader() or next() in the middleware after sending a response to the client.
On datainfinities.com, Read articles all around JavaScript, React, Node.js, PHP, Laravel, and Shopify.
Related Blogs
Remove an item from an array in JavaScript
Factory Design Pattern in JavaScript
Cannot read property of undefined in JavaScript
What is Call Stack in JavaScript
Event Loop and Callback Queue in JavaScript
Uncaught syntaxerror cannot use import statement outside a module
ERESOLVE unable to resolve dependency tree error when installing npm packages
Scaling Node.js Applications With PM2 Clusters
Find greatest common divisor (GCD) in JavaScript
Explore All Blogs