Cannot set headers when they are send to the client-CodePudding

when i try to use response.send() is always shows a message Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client.I have provided the code Pls help me to fix this error.

/**
 * Post is used to create new items
 * Put is used to update the items
 * Listen is used to run the server
 * Delete is used to delete an item
 */

const express = require('express');
const bodyParser = require('body-parser');
const axios = require('axios').default;
const { response } = require('express');
const app = express();

app.use(bodyParser.urlencoded({extended:false}));
app.use(bodyParser.json());

var city = 'delhi';

app.put('/enter_data',(req,res)=>{
  city = req.body.City;
  if(city === "" || !city){
    res.status(500).send({error: "Write something"});}
    else
    {
      res.send("Now you can see the temperature");
    }
})

app.get('/show_temp',(req,res)=>{
  var sample = "https://api.openweathermap.org/data/2.5/weather?q=" city '&units=metric&appid=bb16c5275f7a3c1439973f71e4dc811f';
    res.send("Running");
  axios.get(sample)
  .then(response => {
    var t = "Temperature in " city " is " String(response.data.main.temp) "°C"
    if(t)
    {
    res.status(200).send(t);
    }
  })
  .catch(error => {
    console.log(error);
    //res.status(503).send({status: 1, message: "Messages not available!"});
  })
});

app.listen(5000,()=>{
    console.log("Port Running");
})

CodePudding user response：

You cannot send a response to a request multiple times like this; One request should equate to one response.

app.get('/show_temp',(req,res)=>{
  var sample = "https://api.openweathermap.org/data/2.5/weather?q=" city '&units=metric&appid=bb16c5275f7a3c1439973f71e4dc811f';
   res.send("Running"); // Here you are sending a response of "Running" to the client
  axios.get(sample)
  .then(response => {
    var t = "Temperature in " city " is " String(response.data.main.temp) "°C"
    if(t)
    {
    res.status(200).send(t); // Here is where you are sending you're actual response and thus triggering the error.
    }
  })
  .catch(error => {
    console.log(error);
    //res.status(503).send({status: 1, message: "Messages not available!"});
  })
});

Refactoring this, a solution would be:

app.get('/show_temp',(req,res)=>{
  var sample = "https://api.openweathermap.org/data/2.5/weather?q=" city '&units=metric&appid=bb16c5275f7a3c1439973f71e4dc811f';
  axios.get(sample) 
  .then(response => {
    var t = "Temperature in " city " is " String(response.data.main.temp) "°C"
    if(t)
    {
    res.status(200).send(t);
    }
  })
  .catch(error => {
    console.log(error);
    res.status(503).send({status: 1, message: "Messages not available!"}); // This is fine so long an error is not thrown AFTER the response
  })
});

I will also note that there are definitely use cases for sending different response for different scenarios. You may have a validation step for example, where you need to send a 400 status to the client. In this case, you want to return your response to prevent other responses from being sent.

Example snippet:

if (badData) {
  return res.sendStatus(400)
}
  res.sendStatus(200)