自定义标头已添加到Access-Control-Request-Headers中

Question

I am trying to add a custom header to my angular js GET request as below:

    $http({
        method : 'GET',
        url : s,
        headers : {
        "partnerId" : 221,
         "partnerKey" : "heeHBcntCKZwVsQo"
        }
    })

But the issue is the headers are getting added to Access-Control-Request-Headers as below and I am getting 403 Forbidden response:

User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10.12; rv:50.0)
Gecko/20100101 Firefox/50.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/ *;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: partnerid,partnerkey
Origin: http://localhost:8080
DNT: 1
Connection: keep-alive

I also tried below changes but no luck

return $http.get(s, {
    headers : {
        'partnerId' : 221,
        'partnerKey': 'heeHBcntCKZwVsQo'
        }
    })

In other related answers in SO I saw that the header partnerId and partnerKey need to be enabled in server side. But I am able to add these custom headers in POSTMAN client and other POST clients and able to get the expected response. So I guess I am missing something. Can someone guide me in this. Thanks in advance

Edit: One more thing I noted is that partnerId is replaced as partnerid while passing in the request. Not sure if that makes a difference.

Answer 1

If you add any headers to a scripted cross-origin request other than any CORS-safelisted request-headers , it triggers browsers to first do a CORS preflight request .

There is no way to prevent users' browsers from doing that CORS preflight (though there are ways to get around it locally in your own browser when doing testing; for example, by using Postman).

So for users to be able to use a Web app of yours that makes scripted cross-origin requests with custom headers, the server to which those cross-origin requests go needs to be CORS-aware.

The reason Postman can make such requests without causing a preflight is, Postman's not a browser engine—it's an extension that's not restricted by the same-origin policy, so doesn't need CORS.

Postman can basically do whatever curl or other such tools can do, but just within a browser UI for convenience. It's otherwise bypassing normal Web-security features built into browsers.