10

Firefox and Chrome are giving me CORS error, even though the OPTIONS response contains Access-Control-Allow-Origin.

I'm curious what I need to do to make the OPTIONS preflight cors check pass?

Here are the requests and responses copied from both browsers.

% ## FIREFOX
% curl -i 'http://localhost:5000/sql/change_document_contents?id=1' -X OPTIONS -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:88.0) Gecko/20100101 Firefox/88.0' -H 'Accept: */*' -H 'Accept-Language: en-US,en;q=0.5' --compressed -H 'Access-Control-Request-Method: POST' -H 'Access-Control-Request-Headers: content-type' -H 'Referer: http://localhost:3000/' -H 'Origin: http://localhost:3000' -H 'Connection: keep-alive'
<ol-Request-Headers: content-type' -H 'Referer: http://localhost:3000/' -H 'Origin: http://localhost:3000' -H 'Connection: keep-alive'
HTTP/1.0 200 OK
Content-Type: text/html; charset=utf-8
Content-Length: 0
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Server: Werkzeug/1.0.1 Python/3.9.5
Date: Sat, 29 May 2021 06:08:59 GMT
%
% ## CHROME
% curl 'http://localhost:5000/sql/change_document_contents?id=1' \
  -i \
  -X 'OPTIONS' \
  -H 'Connection: keep-alive' \
  -H 'Accept: */*' \
  -H 'Access-Control-Request-Method: POST' \
  -H 'Access-Control-Request-Headers: content-type' \
  -H 'Origin: http://localhost:3000' \
  -H 'User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.90 Safari/537.36' \
  -H 'Sec-Fetch-Mode: cors' \
  -H 'Sec-Fetch-Site: same-site' \
  -H 'Sec-Fetch-Dest: empty' \
  -H 'Referer: http://localhost:3000/' \
  -H 'Accept-Language: en-US,en;q=0.9' \
  --compressed
HTTP/1.0 200 OK
Content-Type: text/html; charset=utf-8
Content-Length: 0
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS
Server: Werkzeug/1.0.1 Python/3.9.5
Date: Sat, 29 May 2021 06:12:11 GMT

As you can see, headers are there, but the CORS error still appears. Firefox gives the error CORS Missing Allow header on the preflight request, and NS_ERROR_DOM_BAD_URI on the actual POST request. Whereas Chrome says "Cross origin resource sharing error: HeaderDisallowedByPreflightResponse"

0

1 Answer 1

10

The response is missing an Access-Control-Allow-Headers header. In hindsight, the Chrome error message sort of points to this.

To fix, add Access-Control-Allow-Headers: Content-Type to the response.

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

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.