Fetch POST request failing: CORS header

Question

Below is code which sends a post request to a rest API also hosted locally.

const URL ='http://localhost:5000/api/v1.0/tasks/'

function setHIT(HIT_state){
console.log("Sending HIT")
fetch(URL, {
  method: "post",
  headers: {
    'Accept': 'application/json',
    'Content-Type': 'application/json'
  },

  //make sure to serialize your JSON body
  body: JSON.stringify({
    name: 'Example',
    lastname: 'Example'
  })
})
.then( (response) => { 
   console.log(response)
});

}

Previously I was getting CORS request errors, but solved it by disabling Chromium's web security option. GET requests work, however when the code above is called the website receives the following response:

Response {type: "cors", url: "http://localhost:5000/api/v1.0/tasks/", redirected: false, status: 404, ok: false, …}
body: (...)
bodyUsed: false
headers: Headers {}
ok: false
redirected: false
status: 404
statusText: "NOT FOUND"
type: "cors"
url: "http://localhost:5000/api/v1.0/tasks/"
__proto__: Response

The odd things is that there are some requests logged in a database, which means it worked at some point. However I'm not sure what has changed since. What am I missing?

Mr Coder · Accepted Answer · 2019-12-14 16:54:29Z

1

your code structure using a flask cors you should know that.

from flask import Flask
from flask_cors import CORS

cors = CORS(app, resources={r"/api/*": {"origins": "*"}})
app = Flask(__name__)
CORS(app)

@app.route("/")
@cross_origin()
def helloWorld():
  return "Hello, cross-origin-world! this is Handel cors with all route URL  you"

answered Dec 14, 2019 at 16:54

Mr Coder

5234 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Felix Labelle Over a year ago

There's a missing an include for cross_origin in the code. Regardless the issue is still there. I do however see the request getting to the API, so I'll check if it's not an issue with the URL being passed

Felix Labelle Over a year ago

So there were some minor errors and now I get a code 201 (That's what is being set in the API). However I don't see the information the API is supposed to be sending back.

Mr Coder Over a year ago

HTTP Status 201 (Created) HTTP Status 201 indicates that as a result of HTTP POST request, one or more new resources have been successfully created on server. now you need to return a data with response.

Mr Coder · Accepted Answer · 2019-12-14 16:11:23Z

0

what is your backed API?

header('Access-Control-Allow-Origin: http://localhost:5000');

if there is you managing post header from server-side ACL then you need to define a header like Access-Control-Allow-Origin: *
* means all domain

edited Dec 14, 2019 at 16:11

answered Dec 14, 2019 at 16:05

Mr Coder

5234 silver badges13 bronze badges

1 Comment

Felix Labelle Over a year ago

The backend is running on Python (Flask). However the same backend works for GET requests. Is it possible it could work for GET requests and POST requests?

Collectives™ on Stack Overflow

Fetch POST request failing: CORS header

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related