異なるリクエスト（URL）のインターセプタを分割する方法は？

Question

まず、コントローラーごとにJWTトークンを含むconfigAuthのヘッダーがあります。

var configAuth = { 
    headers: { 
     'Content-Type': 'application/json', 
     'Authorization': localStorage.getItem('token') 
    } 
}; 

しかし、今私が大量のコントローラを持っているとき、私はそれについて何かする必要があることを認識しました。私はinterceptorsについて聞いたことがあり、それらを取得しようとしています。

/loginのようなページやリクエストがあり、トークンが全くないはずであるため、すべてのリクエストにトークンを入れることはできません。とAuthorization headerとhtmlファイルを取得する何とか私に例外を与えています。

angular.module('App') 

.factory('sessionInjector',['$injector', function ($injector) { 
    var sessionInjector = { 
     request: function (config) { 
      if (config.url == "/one" || config.url == "/two"){ 
       config.headers['Content-Type'] = 'application/json;charset=utf-8;'; 
       config.headers['Authorization'] = localStorage.getItem('token'); 
      } else { 
       config.headers['Content-Type'] = 'application/json;charset=utf-8;'; 
      } 
      return config; 
     }, 
     response: function(response) { 
      if (response.status === 401) { 
       var stateService = $injector.get('$state'); 
       stateService.go('login'); 
      } 
      return response || $q.when(response); 
     } 
    }; 
    return sessionInjector; 
}]); 

をしかし、それは/one/{one_id}のような要求では動作しませんし、私はすべての可能性をハードコーディングすることはできません。だから私はそのような要求を分割しようとしました。だから、これのベストプラクティスは何ですか？

Answer 1

あなたが今持っているものは良い出発点です。あなたのAPIの大半にauthトークンが必要であると仮定していますので、認証を必要としないエンドポイントを設定する方が早いでしょう。私はこれをテストしていませんが、正しい軌道に乗るかもしれません。インジェクタをプロバイダとしてセットアップして、設定内で匿名ルートルールを設定することができます。これにより

angular.module('App') 
    .provider('sessionInjector',[function() { 
     var _anonymousRouteRules; 

     this.$get = ['$injector', getSessionInjector]; 
     this.setupAnonymousRouteRules = setupAnonymousRouteRules; 

     function getSessionInjector($injector) { 
      var service = { 
       request: requestTransform, 
       response: responseTransform 
      }; 

      function requestTransform(config) {   
       if (!isAnonymousRoute(config.url)){ 
        config.headers['Authorization'] = localStorage.getItem('token'); 
       } 

       config.headers['Content-Type'] = 'application/json;charset=utf-8;'; 

       return config; 
      } 

      function responseTransform(response) { 
       if (response.status === 401) { 
        var stateService = $injector.get('$state'); 
        stateService.go('login'); 
       } 
       return response || $q.when(response); 
      } 

      return service; 
     } 

     function isAnonymousRoute(url) { 
      var isAnonymous = false; 
      angular.forEach(_anonymousRouteRules, function(rule) { 
       if(rule.test(url)) { 
        isAnonymous = true; 
       } 
      }); 
      return isAnonymous; 
     } 

     function setupAnonymousRouteRules(anonymousRouteRules) { 
      _anonymousRouteRules = anonymousRouteRules; 
     } 
    }]); 

、あなたのURLの正規表現の配列を渡すことによってルールを設定することができます

angular.module('App').config(['sessionInjectorProvider', config]); 

function config(sessionInjectorProvider) { 
    sessionInjectorProvider.setupAnonymousRouteRules([ 
     /.*\.html$/, 
     /^\/login$/ 
    ]); 
} 

Answer 2

これを実行するより良い方法があります。ログイン後、認証トークンを$ httpサービスのヘッダーに設定します。そのため、各呼び出しでconfigオブジェクトを渡す必要はありません。

ログイン：この後

function Login(credentials){ 
    $http.post(apiPath, credentials).then(function (data) { 
     $http.defaults.headers.common['Authorization'] = data['token']; 
    }); 
} 

すべてのHTTP呼び出しはAuthorizationヘッダーが設定されています。

しかし、ヘッダーにAuthorizationなしで渡された独自の設定オブジェクトを持つ関数を書くことができる場合は、Authorizationを必要としない呼び出しがあります。許可なく

機能：

function Without_Auth(url, data) { 
    var deferred = $q.defer(); 
    var responsePromise = $http({ 
     method: 'post', 
     url: url, 
     data: data, 
     headers: { 
      'Content-Type': 'application/json;charset=utf-8;' 
     } 
    }) 
    responsePromise.success(function (data) { 
     deferred.resolve(data); 
    }); 
    responsePromise.error(function (err) { 
     deferred.reject(); 
    }); 
    return deferred.promise; 
} 

ホープこれはあなたの問題を解決します！