当前位置: 首页 > 面试题库 >

如何使用angularJS拦截器仅拦截特定的HTTP请求?

琴俊人
2023-03-14
问题内容

我知道如何拦截所有请求,但是我只想拦截来自我资源的请求。

有谁知道如何做到这一点?

services.config(['$httpProvider',function($httpProvider) {
    $httpProvider.interceptors.push('myHttpInterceptor');
}]);

services.factory("userPurchased", function ($resource) {
    return $resource("/api/user/purchases/:action/:item", 
        {}, 
        {
            'list': {method: 'GET', params: {action: 'list'}, isArray: false},
            'save': {method: 'PUT', params: {item: '@item'}},
            'remove': {method: 'DELETE', params: {item: '@item'}},
        }
    );
});

services.factory('myHttpInterceptor', function($q,$rootScope) {
    // $rootScope.showSpinner = false;
    return {

      response: function(response) {
        $rootScope.showSpinner = false;
        // do something on success
        console.log('success');
        console.log('status', response.status);
        //return response;
        return response || $q.when(response);
      },

     responseError: function(response) {
        // do something on error
        $rootScope.showSpinner = true;
        console.log('failure');
        console.log('status', response.status)
        //return response;
        return $q.reject(response);
      }
    };
  });

问题答案:

如果只想拦截来自特定资源的请求,则可以使用可选interceptor$requestaction
属性。Angular的文档请参见此处(用法>操作)

的JavaScript

angular.module('app', ['ngResource']).
  factory('resourceInterceptor', function() {
    return {
      response: function(response) {
        console.log('response intercepted: ', response);
      }
    }
  }).
  factory('resourceService', ['$resource', 'resourceInterceptor', function($resource, resourceInterceptor) {
    return $resource(":name", 
        {}, 
        {
            'list': {method: 'GET', isArray: false, interceptor: resourceInterceptor}
        }
    );
  }]).
  run(['resourceService', '$http', function(resourceService, $http) {
    resourceService.list({name: 'list.json'}); // <= intercepted
    $http.get('list.json'); // <= not intercepted
  }]);

Plunker:http
://plnkr.co/edit/xjJH1rdJyB6vvpDACJOT?p=preview



 类似资料:
  • 问题内容: 我似乎无法让$ httpProvider.interceptors实际进行拦截。我在JSFiddle上创建了一个示例,该示例记录了拦截器运行的时间以及$ http响应成功的时间。在成功返回响应之后,将运行请求拦截器。这似乎有些倒退。 我不能使用transformRequest,因为我需要更改配置中的参数。该部分未显示在示例中。 我正在使用AngularJS 1.1.5 http://j

  • 配置拦截器 declarations: [ AppComponent ], HttpClientModule ], providers: [ [ { provide: HTTP_INTERCEPTORS, useClass: AuthInterceptor, multi: true } ] bootstrap:

  • 本文向大家介绍详解AngularJS中的http拦截,包括了详解AngularJS中的http拦截的使用技巧和注意事项,需要的朋友参考一下 http拦截,即$http服务允许我们与服务端交互,有时候我们希望在发出请求之前以及收到响应之后做些事情。 $httpProvider包含了一个interceptors的数组。 我们这样创建一个interceptor。 接着注册interceptor.  以下

  • 问题内容: 我目前在一个有角度的应用程序中工作,我想为我的应用程序中的所有http请求编写一个拦截器,这反过来会调用一个服务,以了解单点登录会话是否仍处于活动状态,如果未处于活动状态,我应该转到我的单点登录,然后根据用户请求加载下一页或结果。我不确定如何在AngularJS中编写拦截器,也不确定将页面重定向到“单一登录”时如何保存用户请求。 我当前正在使用angularjs 1.0.2,我看到在1

  • 问题内容: 我正在使用Java EE 6和Jboss AS7.1,并尝试使用拦截器绑定(来自jboss网站的示例)。 我有一个InterceptorBinding注解: 拦截器: 还有一个豆: 但是拦截器没有被称为。。。 在编写此代码时将调用拦截器: 谢谢你的帮助。 问题答案: 您是否按照参考示例中的说明启用了拦截器? 缺省情况下,bean档案没有通过拦截器绑定绑定的已启用拦截器。必须通过将侦听器

  • 问题内容: 我在使用TypeScript在AngularJS中设置请求拦截器时遇到问题 以下代码段有效,但无效版本已注释掉。无论我在构造函数中注入什么,局部变量在方法中都是未定义的。 问题答案: 是因为错误。解: