'POST http://localhost:9000/ net::ERR_CONNECTION_REFUSED [duplicate]

I am trying to send some data to api via post request.

Frontend Code (React)

handleSubmit = e => {
    e.preventDefault();
    fetch("http://localhost:9000", {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({
        title: this.state.title,
        text: this.state.text
      })
    });
  };

Server (Express)

var urlencodedParser = bodyParser.urlencoded({ extended: false });
app.post("/", urlencodedParser, function(req, res) {
  sql = "INSERT INTO POSTS (id, title, text) VALUES ?";
  var values = [[uuidv1().toString(), req.body.title, req.body.text]];
  con.query(sql, [values], function(err, result, fields) {
    if (err) throw err;
  });
});

When I'm submitting the form, I'm getting this error message from developer console Error Message

I am running client side on localhost:3000 and server side on localhost:9000. Can someone let me know how this problem occurs and how can I fix it?



Solution 1:[1]

In your package.json file in root directory add proxy property like:

{
    "proxy": "http://localhost:9000"
}

Solution 2:[2]

I found the solution. Apparently data is not being posted. So I have to replace headers with

headers: {'Content-Type':'application/x-www-form-urlencoded'}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Arturas
Solution 2 Ricky Geng