web-dev-qa-db-fra.com

Comment empêcher l'objet angular.js $ http d'envoyer un en-tête X-Requested-With?

Angular.js, lors de l'accès à un service Web à l'aide de l'objet $ http, ajoute automatiquement un en-tête X-Requested-With: XMLHttpRequest à la demande.

Le service Web auquel j'accède à l'aide de CORS ne prend pas en charge l'en-tête X-Requested-With. J'ai donc essayé de l'éliminer, mais je ne peux pas accéder à l'objet $ httpProvider. Je reçois une erreur d'objet non défini et si je la référence dans les paramètres du contrôleur, de sorte que angular l'injecte, le message "Erreur: fournisseur inconnu: $ httpProviderProvider <- $ httpProvider"

Je me demande donc comment puis-je accéder à $ httpProvider, comme indiqué dans la documentation (http://docs.angularjs.org/api/ng.$http) pour dire à angular.js de ne pas envoyer cet en-tête ...

javascriptweb-servicesxmlhttprequestangularjs
25
opensas
angular.module('myModule', [])
    .config(['$httpProvider', function($httpProvider) {
        delete $httpProvider.defaults.headers.common["X-Requested-With"]
    }])
26
Justen

J'ai trouvé que, en plus de la réponse de Justen, je peux aussi le faire à la demande comme ceci:

delete $http.defaults.headers.common['X-Requested-With']
11
opensas

Depuis Angular JS version 1.1.1, la suppression de l'en-tête n'est plus nécessaire.

Voir le journal des modifications:
https://github.com/angular/angular.js/blob/master/CHANGELOG.md#111-pathological-kerning-2012-11-11

Pour les personnes comme moi qui utilisaient l'en-tête pour identifier les demandes ajax et y répondre différemment.

par exemple. faire une demande après la fin de la session.

Vous pouvez réactiver l'en-tête comme ceci:

angular.module('yourModule', [])
.config(['$httpProvider', function($httpProvider) {
    $httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
}]);
6
Josue Alexander Ibarra

Depuis Angular JS version 1.1.1, la suppression de l'en-tête n'est plus nécessaire. Ce changement a été mentionné sur https://www.owasp.org/index.php/Cross-Site_Request_Forgery_(CSRF)_Prevention_Cheat_Sheet#Protecting_REST_Services:_Use_of_Custom_Request_Headers

Comme l'a montré Josue, ceci peut facilement être ajouté à toutes les demandes de la manière suivante:

angular.module('yourModule', [])
    .config(['$httpProvider', function($httpProvider) {
        $httpProvider.defaults.headers.common["X-Requested-With"] = 'XMLHttpRequest';
    }]);

Définissez la configuration de l'en-tête sur undefined pour supprimer l'en-tête de demandes externes spécifiques.

let urlExternalValidator = 'https://openiban.com/validate/' + this.iban + '?getBIC=true&validateBankCode=true';
this.$http.get(urlExternalValidator, {
    // simple request to not trigger a CORS preflight
    // https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
    headers: {
        'X-Requested-With': undefined
    }
})

De plus, vous pouvez fournir une propriété d'en-tête dans l'objet config passé lors de l'appel de $ http (config), qui remplace les valeurs par défaut sans les changer globalement.

Pour supprimer explicitement un en-tête ajouté automatiquement via $ httpProvider.defaults.headers à la demande, utilisez les en-têtes propriété, en définissant l'en-tête souhaité sur non défini

https://docs.angularjs.org/api/ng/service/ $ http # setting-http-headers

0
ofthelit