Définition des en-têtes HTTP pour l'ensemble de l'application dans AngularJS

Question

Existe-t-il un moyen de définir le $httpProvider en dehors de l'en-tête angular.module('myApp', []).config() ?

Je reçois un Auth-Token du serveur après avoir connecté l'utilisateur, et j'ai besoin de l'ajouter en tant que HTTP Header à toutes les requêtes suivantes.

Answer 1

Vous pouvez utiliser les en-têtes par défaut pour angular 1.0.x :

$http.defaults.headers.common['Authentication'] = 'authentication';

ou intercepteur de requête pour angular 1.1.x+ :

myapp.factory('httpRequestInterceptor', function () {
  return {
    request: function (config) {

      // use this to destroying other existing headers
      config.headers = {'Authentication':'authentication'}

      // use this to prevent destroying other existing headers
      // config.headers['Authorization'] = 'authentication';

      return config;
    }
  };
});

myapp.config(function ($httpProvider) {
  $httpProvider.interceptors.push('httpRequestInterceptor');
});

Comme les fabriques/services sont des singletons, cela fonctionne tant que vous n'avez pas besoin de modifier dynamiquement votre valeur d'authentification après l'instanciation du service.

Answer 2

$http.defaults.headers.common['Auth-Token'] = 'token';

Il semble headers() normalise les noms des clés.

Answer 3

Ajoutant aux réponses ci-dessus de @Guria et @Panga

config.headers['X-Access-Token'] = $window.sessionStorage.token;

On peut utiliser x-access-token dans l'en-tête comme JWT(jsonwebtoken). Je stocke JWT dans le stockage de session quand un utilisateur s'authentifie pour la première fois.