Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

Matthew C.

—July 15, 2024

The Problem

When creating a REST API endpoint using Node.js, you may get the following error message when making a request to your API endpoint:

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

This error occurs when an HTTP header is set after an HTTP response is sent or when the API endpoint sends two or more responses per request.

For example, the following Express.js API endpoint would cause the error:

app.post("/feedback", async (req, res) => {
  const { email, message } = req.body;
  if (email && message) {
    res.json({ success: true });
  } else {
    res.status(500).json({ error: "Email and message are required." });
  }
  res.json({ success: true });
});

The Express.js res.json() method sends a JSON response in and after the if statement. Each HTTP request should only have one response.

You’ll get the same error if you set an HTTP header, such as the Content-Type header, after sending a response:

res.status(500).json({ error: "Email and message are required." });
res.type("application/json");

The Solution

Make sure that your API endpoint sends only one response per request and that you don’t set HTTP headers after sending a response.

Send One Response Per Request

Check that the methods that send a response, such as the res.send(), res.json(), and res.end() Express.js methods, are only called once.

In the example API endpoint code above, remove the res.json({ success: true }); line after the if statement:

app.post("/feedback", async (req, res) => {
  const { email, message } = req.body;
  if (email && message) {
    res.json({ success: true });
  } else {
    res.status(500).json({ error: "Email and message are required." });
  }
});

Set Response Headers Before Sending a Response

Set HTTP headers before you send a response. For example:

res.type("application/json");
res.status(500).json({ error: "Email and message are required." });

Check Middleware or Third-party Libraries That Modify Response Headers or Send Responses

Another possible cause for this error is middleware or third-party libraries that modify response headers or send responses.

The following example code uses an Express.js error-handling middleware function to send error responses when an error occurs in an API route:

app.post("/feedback", async (req, res, next) => {
  try {
    const { email, message } = req.body;
    if (!email || !message) {
      throw new Error("Email and message are required.");
    }
    res.json({ success: true });
  } catch (err) {
    next(err); // Pass errors to Express error handler
  }
});

app.use((err, req, res, next) => {
  res.status(500).json({ error: err.message });
});

Make sure that you don’t send an error response in your API routes. Throw an error and use the next() function to pass the errors to the error handling middleware, where the error response will be sent.

In Express.js, middleware functions are functions that have access to the request object (req), the response object (res), and the next middleware function in the application’s request-response cycle.

If you return a response before calling the next() function, you’ll get an error:

catch (err) {
  res.status(500).json({ error: err.message });
  next(err);
}

Check Asynchronous Requests

If you’re setting HTTP headers or sending HTTP requests in async functions, check that the HTTP headers are set and responses are sent when expected. The following example code would cause the Content-Type HTTP header to be set after sending a response:

fetch("https://example.com/load").then((data) => {
  // process response
  res.type("application/json");
});
res.json({ success: true });

This example code can be fixed by moving the HTTP response method into the then() method of the fetch() promise:

fetch("https://example.com/load").then((data) => {
  // process response
  res.type("application/json");
  res.json({ success: true });
});