I'm doing a POST to a service using Postman Chrome Extension, and I get the expected response.
But, when I do the same POST request using $http
, all goes to hell.
I get a :
Request header field Engaged-Auth-Token is not allowed by Access-Control-Allow-Headers
Engaged-Auth-Token
being a header.
I've no idea why with Postman works and it doesn't work with Chrome...
Any ideas?
Use a Chrome extension to add Access-Control-Allow-Origin header into every response. To find one of them, just head over to Chrome Webstore and type in "CORS", dozens will show up in the search result. Or you can install CORS Helper, CORS Unblock or dyna CORS right away.
I believe configuring the Access-Control-Allow-Headers on the $httpProvider on the CLIENT will not work. I think the header needs to be configured on the server (as a response header). In a node-express application for instance, this could be done with a middleware (for example), putting something like this:
res.header('*')
or (more selectively) just the headers you need:
res.header('Engaged-Auth-Token, Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
The issue is because of missing Access-Control-Allow-Headers
from request Header. To fix this we need to add Access-Control-Allow-Headers: *
to request header
Add a Access-Control-Allow-Headers
to the http request header
. You can do this at app level using $httpProvider
. Add below line in your app config section to add this header.
var app = angular.module("app", [
"ngRoute",
"app.controllers",
"app.directives",
"app.filters"
]);
app.config([
"$routeProvider",
"$httpProvider",
function($routeProvider, $httpProvider){
$httpProvider.defaults.headers.common['Access-Control-Allow-Headers'] = '*';
}
]);
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With