4

ノードアプリにJWT認証システムを入れました。

インターセプターを使用して、すべてのリクエストに Bearer を配置しました。Angular 内で制限されたルートを呼び出すか、curl してヘッダーでトークンを指定すると、うまく機能します。
しかし、制限されたルートをアドレス バーに直接入力すると、機能しません。ヘッダーには Bearer がなく、インターセプターを通過しません。

これが私のインターセプターです（クライアント側）：

angular.module('myApp).factory('authInterceptor', function ($rootScope, $q, $window) {
  return {
    request: function (config) {
      config.headers = config.headers || {};
      if ($window.localStorage.token) {
        config.headers.Authorization = 'Bearer ' + $window.localStorage.token;
      }
      return config;
    },
    responseError: function (rejection) {
      if (rejection.status === 401) {
        // handle the case where the user is not authenticated
      }
      return $q.reject(rejection);
    }
  };
});
angular.module('myApp').config(function ($httpProvider) {
  $httpProvider.interceptors.push('authInterceptor');
});

これが私の制限されたルートです（サーバー側）：

router.get('/restricted', expressJwt({secret: 'SecretStory'}), function(req, res) {
  res.json({
      name: 'You are allowed here !!'
    });
})

制限されたルートをアドレスバーに直接入力する場合でも、リクエストごとにベアラーをリクエストヘッダーに追加する方法は?

4

1 に答える 1

2

アドレスバーに URL を直接入力すると、Angular コードを回避していることになり、お気づきのとおり、インターセプターは実行されません。

アドレス バーの URL が変更されたことを検出して問題を回避することもできますが、これはお勧めしません。

代わりに、(実際にはそうではないもの) のヘッダーをGET /restricted持つ要求を検出することで、サーバー側でこの問題に取り組みます。次に、Angular コードを含む HTML で応答し、ページの読み込み時に使用して再度要求します。これは、明示的な URL ナビゲーションと Angular リクエストを区別する良い方法であり、API により優れたハイパーメディア サポートを提供します。Accepttext/htmlapplication/json/restrictedapplication/json

于 2015-04-21T20:41:36.057 に答える