CORS error but only on POST request, despite cors config (GET have no issue)

问题

I use a nodejs express server. Despite allowing the host, I still have an CORS error

" No 'Access-Control-Allow-Origin' header is present on the requested resource."

but only for the POST endpoint. The "GET" have no issue. Both (GET and POST) endpoint are allowed for my client-browser:

My server:(running on http://serverURL)

var whitelist = ['http://localhost:4200', 'http://someOtherDeployUrl.com']
var corsOptionsDelegate = function (req, callback) {
    var corsOptions;
    if (whitelist.indexOf(req.header('Origin')) !== -1) {
        corsOptions = {origin: true} // reflect (enable) the requested origin in the CORS response
    } else {
        corsOptions = {origin: false} // disable CORS for this request
    }
    corsOptions.methods= "GET,HEAD,PUT,PATCH,POST,DELETE"; 
    callback(null, corsOptions) // callback expects two parameters: error and options
}


router.post('/score', cors(corsOptionsDelegate), function (req, res, next) {
    ...
    res.status(200).send('Ok');
});

router.get('/scores', cors(corsOptionsDelegate), function (req, res, next) {
    res.status(200).send(scores);
});

The client ( angular 9) : (running on localhost:4200)

  public saveScore(player, score) {
    console.log("save score")
    let objectObservable = this.http.post("http://serverURL/score", {
      player: player,
      score
    }).subscribe(
      data => console.log('success', data),
      error => console.log('oops', error)
    );

    return objectObservable

  }

  public getScores() {
    return this.http.get("http://serverURL/scores");
  }

any idea why it's don't work?

The whole request/response of the GET:

Response:

Referrer Policy: no-referrer-when-downgrade
Access-Control-Allow-Origin: http://localhost:4200
Content-Length: 2
Content-Type: application/json; charset=utf-8
Date: Sun, 14 Jun 2020 14:42:35 GMT
Etag: W/"2-l9Fw4VUO7kr8CvBlt4zaMCqXZ0w"
Server: Cowboy
Vary: Origin
Via: 1.1 vegur
X-Powered-By: Express

Request:

Accept: application/json, text/plain, */*
Accept-Encoding: gzip, deflate
Accept-Language: en,en-US;q=0.9,fr-FR;q=0.8,fr;q=0.7
Connection: keep-alive
DNT: 1
Host: serverUrl
If-None-Match: W/"2-l9Fw4VUO7kr8CvBlt4zaMCqXZ0w"
Origin: http://localhost:4200
Referer: http://localhost:4200/menu
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.97 Safari/537.36

The whole response/request for the (failing) POST Response:

Allow: POST
Connection: keep-alive
Content-Length: 4
Content-Type: text/html; charset=utf-8
Date: Sun, 14 Jun 2020 14:30:00 GMT
Etag: W/"4-Yf+Bwwqjx254r+pisuO9HfpJ6FQ"
Server: Cowboy
Via: 1.1 vegur
X-Powered-By: Express

Request:

Accept: */*
Accept-Encoding: gzip, deflate
Accept-Language: en,en-US;q=0.9,fr-FR;q=0.8,fr;q=0.7
Access-Control-Request-Headers: content-type
Access-Control-Request-Method: POST
Connection: keep-alive
Host: serverUrl
Origin: http://localhost:4200
Referer: http://localhost:4200/menu
Sec-Fetch-Mode: cors
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/83.0.4103.97 Safari/537.36

回答1:

Try enabling CORS preflight (OPTIONS) handling for your route.

When you need your route to handle so-called complex CORS operations, you must add a OPTIONS route handler. The browsers send an extra request, an OPTIONS request.

Why is this extra complex? Because cybercreeps.

Add this route handler. Right before your post handling is a good place for it.

router.options('/score', cors())

来源：https://stackoverflow.com/questions/62374111/cors-error-but-only-on-post-request-despite-cors-config-get-have-no-issue

标签

node.js

rest

express

cors