Javascript Girl
  1. Javascript Girl
  3. Js angulaire ajoutent un paramètre de demande sur chaque demande http $ http
Intereting Posts
Comment puis-je accéder aux méthodes dans React pour les tests unitaires Comment ouvrir un fichier avec boîte de dialogue d'impression en utilisant JavaScript Comment puis-je détecter les générateurs ES6? Comment créer un paquet minifié et non compressé avec un webpack? Obtenir une URL absolue d'une version relative. (Problème IE6) JQuery – supprimez le style ajouté avec la fonction .css () JqGrid Internationalisation Comment cacher une <option> dans un menu <select> avec CSS? Chart.js diagramme à barres changement de couleur basé sur la valeur Équivalent Jquery / compatibilité du navigateur pour e.parentNode.parentNode.childNodes .innerText; L'utilisation de BackboneJs de JavaScript: comment calculer le nombre de jours entre deux dates en utilisant javascript Accéder à la première propriété d'un objet Comment savoir si le texte dans une zone de texte est sélectionné? Récupération des champs de saisie avec des valeurs de l'objet JSON

Js angulaire ajoutent un paramètre de demande sur chaque demande http $ http

Je voudrais utiliser angular $ http pour interagir avec api, mais j'ai besoin de stocker mon jeton d'authentification sur $ http, de sorte que, dans toutes les requêtes, si le poste est supprimé, je veux que le jeton soit présent, aussi j'ai vu des gens placer Tokens dans l'en-tête, je sais comment le placer dans l'en-tête, mais je ne sais pas si c'est une bonne pratique de mettre des jetons dans l'en-tête, voici ma configuration: 

config(['$stateProvider', '$urlRouterProvider','$http', function($stateProvider, $urlRouterProvider, $http) { $urlRouterProvider.otherwise("/view1"); }]);

Pour communiquer avec une API qui nécessite une authentification par jeton, vous devez configurer un intercepteur.

Dans votre fichier de configuration: 

 function config(..., $httpProvider) { $httpProvider.interceptors.push('authInterceptor'); ... } angular .module('app') .config(config);

AuthInterceptor est une usine qui s'occupera d'ajouter des en-têtes à toutes vos demandes $ http: 

 function authInterceptor($rootScope, $q, $window) { return { request: function (config) { config.headers = config.headers || {}; if ($window.sessionStorage.token) { config.headers.Authorization = 'Bearer ' + $window.sessionStorage.token; } return config; }, responseError: function (rejection) { if (rejection.status === 401) { console.log("not authorised"); } return $q.reject(rejection); } }; }; angular .module('app') .factory('authInterceptor', authInterceptor);

Le jeton peut venir de sessionStorage, cookies ou n'importe quoi.

Config $ httpProvider au démarrage! 

 'use strict'; angular.module('app') .config(configHttp); configHttp.$inject = ['$httpProvider']; function configHttp($httpProvider) { if (!$httpProvider.defaults.headers.get) { $httpProvider.defaults.headers.get = {}; } //disable IE ajax request caching $httpProvider.defaults.headers.get['If-Modified-Since'] = 'Mon, 26 Jul 1997 05:00:00 GMT'; // extra $httpProvider.defaults.headers.get['Cache-Control'] = 'no-cache'; $httpProvider.defaults.headers.get.Pragma = 'no-cache'; // User Credential $httpProvider.defaults.headers.post['user-credential'] = 'xxxxxx'; }

En suivant la spécification HTTP clairement, le bon endroit pour le jeton d'autorisation est dans les en-têtes.