Chrome vs Firefox - Why do CORS headers behave differently, and how should I use them?

问题

I am doing Ajax calls with CORS headers. The short version is that in Firefox, it all works nicely, in Chrome I get an error: "Refused to set unsafe header Access-Control-Request-Method", and the same thing for Access-Control-Request-Headers.

So, I am just confused. Like, very confused. What is it that I have to do in order to make CORS work properly in both Chrome and Firefox?

The weird part I will say, though, is that it seems that despite the error, Chrome does execute the Ajax call.

I am just confused overall, I'm new to JavaScript and very new to CORS, just trying to make this work.

PS - all of this is local development through IntelliJ, not sure but that might be a factor.

PPS. Short summary: everything works nicely in Firefox, I get errors in Chrome but it still executes the request properly.

PPPS. Here's the code I'm using for all my Ajax calls.

function(uri, method, json){
    return $.ajax({
        url: orgProps.serverOrigin + ensurePrecedingSlash(uri),
        type: method,
        headers: (function(){
            var result = {
                "Access-Control-Request-Headers": [
                    "X-Requested-With",
                    "Authorization"
                ],
                "Access-Control-Request-Method": method
            };

            var token = jwt.getToken();
            if(token !== undefined && token !== null){
                result.Authorization = restoreBearerPrefix(token);
            }
            return result;
        })(),
        contentType: "application/json; charset=utf-8",
        data: (function(){
            if(json !== undefined) {
                return JSON.stringify(json);
            }
            return null;
        })()
    })
    .done(function(data, status, jqXHR){
        var token = jqXHR.getResponseHeader("Authorization");
        jwt.storeToken(token);
    });

来源：https://stackoverflow.com/questions/41080556/chrome-vs-firefox-why-do-cors-headers-behave-differently-and-how-should-i-use

标签

javascript

jquery

ajax

google-chrome

firefox