Method Delete with Express, Axios and React not work

2
votes

i have a problem, i trying do the method delete with Express, Axios and Reactbut they are giving error e not working...

My code with AXIOS.JS with REACT:

remove = (name, id) => {
  axios.delete('http://127.0.0.1:9000/people/' + id).
  then((response => id.splice(name, 1)))
}

My EXPRESS.JS:

app.delete('/people', function (req, res) {
  res.send('DELETE request to homepage');
});

And the errors:

OPTIONS http://127.0.0.1:9000/people/0 404 (Not Found)

Failed to load http://127.0.0.1:9000/people/0: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access. The response had HTTP status code 404.

Uncaught (in promise) Error: Network Error at createError (createError.js:16) at XMLHttpRequest.handleError (xhr.js:87)

Someone help me please?

2
javascriptexpressaxios
have you checked your server log? sometimes, if server crashes while serving the request (due to any error), it turns out to same kind of problem. – Nah
Did you solve this? I'd be interested in the answer. – geoidesic

2 Answers

0
votes

It looks like that you have to enable CORS in Express, take a look at this answer: How to allow CORS?.

-1
votes

It looks like you are trying to send ID as request parameter to your backed.

You'll have to

Change axios.delete('http://127.0.0.1:9000/people/' + id).

to axios.delete('http://127.0.0.1:9000/people/:' id).

And 

app.delete('/people', function (req, res) {

To 

 app.delete('/people/id', function (req, res) {

You also need to enable CORS on your server side 

app.use(function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
next();
});