Search code examples
javascriptajaxxmlhttprequestcorsaccess-control

CORS preflight return Access-Control-Allow-Origin but response hangs on

I am doing CORS request, and server, has returned me such set of headers for preflight OPTIONS request. 

Access-Control-Allow-Headers:authorization
Access-Control-Allow-Methods:POST, OPTIONS
Access-Control-Allow-Origin:*
Connection:Keep-Alive
Content-Length:0
Content-Type:application/json
Date:Sat, 09 Dec 2017 21:02:47 GMT
Keep-Alive:timeout=5, max=100
Server:Apache

And also next POST request was performed successfully, but I am still getting error in the console.

No 'Access-Control-Allow-Origin' header is present on the requested resource. 
Origin 'bla-bla-bla.com' is therefore not allowed access. 

If an opaque response serves your needs, 
set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

Or should the POST response also send me a header Access-Control-Allow-Origin:*?

Am I need to do something else from the client side to perform CORS? Thanks :)

Solution

  • Both the preflight and actual response must grant permission with Access-Control-Allow-Origin.

    If only the prelight does, then the order of events is:

    1. JavaScript asks to make request
    2. Browser makes preflight request
    3. Server sends preflight response
    4. Browser checks CORS (passes)
    5. Browser makes actual request
    6. Server sends actual response
    7. Browser checks CORS (fails)
    8. Browser denies permission to read the response to JS