Question

当我点击API时，我一直试图拦截401响应，但令人沮丧的是根本没有工作。

当我访问特定链接时，在浏览器控制台上，我可以看到它正在响应401.基本上我想在遇到此类响应时将其重定向到我的登录页面。我在这里看到了很多问题，并尝试做类似的事情，但它不起作用。

以下是我的main.js文件的内容。

var app = angular.module('strelsau_client', ['ngRoute', 'ngResource', 'angularCSS']).config(function ($provide, $httpProvider) {

// Intercept http calls.
$provide.factory('MyHttpInterceptor', function ($q) {
return {
  // On request success
  request: function (config) {
     console.log(config); // Contains the data about the request before it is sent.

    // Return the config or wrap it in a promise if blank.
    return config || $q.when(config);
  },

  // On request failure
  requestError: function (rejection) {
     console.log(rejection); // Contains the data about the error on the request.

    // Return the promise rejection.
    return $q.reject(rejection);
  },

  // On response success
  response: function (response) {
     console.log(response); // Contains the data from the response.

    // Return the response or promise.
    return response || $q.when(response);
  },

  // On response failture
  responseError: function (rejection) {
    console.log(rejection); // Contains the data about the error.

    // Return the promise rejection.
    return $q.reject(rejection);
  }
};
});

// Add the interceptor to the $httpProvider.
$httpProvider.interceptors.push('MyHttpInterceptor');

});


app.config(function($routeProvider) {
$routeProvider
    .when('/', {
        templateUrl: 'views/bookings/fare.html',
        controller: 'BookingsCtrl',
        css: ['../assets/css/stylesheet.css']
    })
    .when('/admin',{
        templateUrl:'views/admin/index.html',
        controller: 'AdminCtrl',
        css: ['../assets/css/vendor.css','../assets/css/flat-admin.css']

    })
            .when('/admin/taxis',{
        templateUrl:'views/admin/taxis.html',
        controller: 'AdminCtrl',
        css: ['../assets/css/vendor.css','../assets/css/flat-admin.css']

    })

            .when('/admin/customers',{
        templateUrl:'views/admin/customers.html',
        controller: 'AdminCtrl',
        css: ['../assets/css/vendor.css','../assets/css/flat-admin.css']

    })

    .when('/admin/set_price', {
        templateUrl: 'views/admin/set_price.html',
        controller: 'AdminCtrl'
    })

    .when('/admin/adddriver', {
        templateUrl: 'views/admin/add_taxi_driver.html',
        controller: 'AdminCtrl'
    })
            .when('/signup', {
        templateUrl: 'views/signup.html',
        controller: 'AccountCtrl'
    })

    .otherwise({
        redirectTo: '/'
    });

});

Answer 1

我要在下面发布我的工作代码，以便您可以比较和调整您的代码：

angular.module("application").config(['$httpProvider' ,function($httpProvider) {
   $httpProvider.interceptors.push(['$rootScope','$q','$location','$injector', function($rootScope, $q, $location, $injector) {
      return {
        responseError: function(rejection) {
              var $state = $injector.get('$state');

              if(rejection.status <= 0) {

              }else if (rejection.status == 401) {
                  // Here I pick my 401
              }else if (rejection.status == 404) {
                  //$state.go('404');
              }else if (rejection.status == 500) {
                  $state.go('500');
              }
              return $q.reject(rejection);
          }
      };
    }
  ]);
 }
]);

希望有帮助=）

Answer 2

我终于在服务级别进行了拦截。我是这样做的：

app.service('AdminService', function($resource) {
return $resource('http://localhost:3000/admin/customers',{},{
query:{
    method: 'GET',
        interceptor: {
    response:function(data){
        console.log("success");
    },
    responseError: function(data){
        window.location="/#/admin/login";
    }
}
},

});
});

无法拦截401 Angular

2 个答案: