angularjs - 我的身份验证 token 拦截器不拦截新路由的请求/响应

Question

我正在尝试为我的 nodejs、express 和 angularjs 应用程序实现 jwt 身份验证。到目前为止，我已经生成了 token ，并将其存储在我的 localStorage 中。根据this教程，我在 angular.factory 中实现了 authInterceptor 如下:

app.factory('authInterceptor', function ($rootScope, $q, $window) {
  return {
    request: function (config) {
      config.headers = config.headers || {};
      if ($window.localStorage.myToken) {
        config.headers.Authorization = 'Bearer ' + $window.localStorage.myToken;

      }
      return config;
    },
    response: function (response) {
      if (response.status === "401") {
        $window.location.replace('/dash');
      }
      return response || $q.when(response);
    }
  };
});

我已将拦截器推送到配置文件中，如下所示:

$httpProvider.interceptors.push('authInterceptor');

到目前为止，我已经将凭据发送到服务器，生成 token 并将其存储在 localStorage 中。

所以只要我没有从 localStorage 中删除 token ，并且 token 还没有过期，我认为它应该会持续存在。如果我使用 angularjs 的后台 ajax 调用从加载页面内发出请求，则身份验证 header 将按预期设置。

Authorization: Bearer eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyIjoiYSIsInR5cGUiOiJzYWxlcyIsImlhdCI6MTQyMjI2MDExMCwiZXhwIjoxNDIyMjc4MTEwfQ.Iv6W-Tc8Qm4FGclzmgbtjvWFz_tyDwEvrFmMmucONpY

然而，当我导航到新路线时，我的请求和响应都没有被拦截。例如，我有我的“/销售”路线。但是当我从地址栏导航到销售路由时，请求认证头都没有被拦截器设置，因此从服务器返回授权错误401，也没有被拦截；因此不会重定向到 /dash。

这是错误的链接，以及对未授权路由“/sales”的 GET 请求的 header :

Answer 1

您的后端是否发送 WWW-Authenticate header 以及 401 状态？如果是这样，并且它包含 Basic，浏览器将捕获响应并在 Angular 捕获它之前显示凭据弹出窗口。

尝试删除或更改它。

引用资料:

• AngularJS Interceptor Never Catches 401 Error
• http://olefriis.blogspot.com/2014/01/http-basic-authentication-in-angularjs.html
• Preventing HTTP Basic Auth Dialog using AngularJS Interceptors