web-dev-qa-db-fra.com

Le champ d'en-tête de demande n'est pas autorisé par Access-Control-Allow-Headers avec $ http

Je fais unPOSTà un service à l'aide de Postman Chrome Extension , et j'obtiens la réponse attendue.

Mais, quand je fais la même chosePOSTrequest en utilisant $http, tout va au diable.

J'ai un :

Request header field Engaged-Auth-Token is not allowed by Access-Control-Allow-Headers

Engaged-Auth-Token étant un en-tête.

Je ne sais pas pourquoi avec Postman fonctionne et cela ne fonctionne pas avec Chrome ...

Des idées?

angularjsposthttp-headersrequesthttp-post
6
Ariel Altamirano

Le problème est dû à l'absence de Access-Control-Allow-Headers dans l'en-tête de la demande. Pour résoudre ce problème, nous devons ajouter Access-Control-Allow-Headers: * à l'en-tête de la demande.

Ajoutez un Access-Control-Allow-Headers au http request header. Vous pouvez le faire au niveau de l'application en utilisant $httpProvider. Ajoutez la ligne ci-dessous dans la section de configuration de votre application pour ajouter cet en-tête.

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'] = '*';
    }
]);
1
Aditya Singh

Je crois que la configuration de Access-Control-Allow-Headers sur le $ httpProvider sur le CLIENT ne fonctionnera pas. Je pense que l'en-tête doit être configuré sur le serveur (en tant qu'en-tête de réponse). Dans une application nœud-express, par exemple, cela pourrait être fait avec un middleware (par exemple), en mettant comme ceci:

res.header('*')

ou (plus sélectivement) uniquement les en-têtes dont vous avez besoin:

res.header('Engaged-Auth-Token, Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
7
raul

si utilisez voiles api sur le backend change cors.js et ajoutez votre jeton classé ici

module.exports.cors = {
  allRoutes: true,
  Origin: '*',
  credentials: true,
  methods: 'GET, POST, PUT, DELETE, OPTIONS, HEAD',
  headers: 'Origin, X-Requested-With, Content-Type, Accept, Engaged-Auth-Token'
};
0
Sedat Y