javascript - angular js在每个http请求$http上添加请求参数

Question

我想使用 angular $http 与 api 交互，但我需要将我的身份验证 token 存储到 $http，以便在每个请求中无论是 post get put delete，我都希望 token 存在，我也有看到有人在 header 中放置标记，我知道如何将它放在 header 中，但我不确定将标记放在 header 中是否是一个好习惯，这是我的配置:

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

}]);

Answer 1

要与需要 token 认证的 API 通信，您需要设置拦截器。

在你的配置文件中:

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

authInterceptor 是一个工厂，负责为所有 $http 请求添加 header :

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);

token 可以来自 sessionStorage、cookie 或任何东西。