欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

angular http interceptors 拦截器使用分享

程序员文章站 2022-12-21 16:13:17
拦截器 在开始创建拦截器之前,一定要了解 $q和延期承诺api 出于全局错误处理,身份验证或请求的任何同步或异步预处理或响应的后处理目的,希望能够在将请求移交给服务器之前拦截请求,并在将请求移交给服务器之前将响应拦截发起这些请求的应用程序代码-拦截器利用promise api满足同步和异步预处理的需 ......

拦截器

在开始创建拦截器之前,一定要了解 $q和延期承诺api

出于全局错误处理,身份验证或请求的任何同步或异步预处理或响应的后处理目的,希望能够在将请求移交给服务器之前拦截请求,并在将请求移交给服务器之前将响应拦截发起这些请求的应用程序代码-拦截器利用promise api满足同步和异步预处理的需求。

拦截器是$httpprovider通过将它们添加到$httpprovider.interceptors数组而向其注册的服务工厂调用工厂并注入依赖项(如果指定),并返回拦截器。

有两种拦截器(和两种拒绝拦截器):

  • request:拦截器通过http config对象调用。该函数可以*修改config对象或创建新对象。函数需要config直接返回对象,或者包含config或新config对象的promise。
  • requesterror:当先前的拦截器抛出错误或被拒绝解决时,拦截器将被调用。
  • response:拦截器通过http response对象调用。该函数可以*修改response对象或创建新对象。函数需要response直接返回对象,或者作为包含response或新response对象的承诺
  • responseerror:当先前的拦截器抛出错误或被拒绝解决时,拦截器将被调用。
 1 // register the interceptor as a service
 2 $provide.factory('myhttpinterceptor', function($q, dependency1, dependency2) {
 3   return {
 4     // optional method
 5     'request': function(config) {
 6       // do something on success
 7       return config;
 8     },
 9 
10     // optional method
11    'requesterror': function(rejection) {
12       // do something on error
13       if (canrecover(rejection)) {
14         return responseornewpromise
15       }
16       return $q.reject(rejection);
17     },
18 
19 
20 
21     // optional method
22     'response': function(response) {
23       // do something on success
24       return response;
25     },
26 
27     // optional method
28    'responseerror': function(rejection) {
29       // do something on error
30       if (canrecover(rejection)) {
31         return responseornewpromise
32       }
33       return $q.reject(rejection);
34     }
35   };
36 });
37 
38 $httpprovider.interceptors.push('myhttpinterceptor');
39 
40 
41 // alternatively, register the interceptor via an anonymous factory
42 $httpprovider.interceptors.push(function($q, dependency1, dependency2) {
43   return {
44    'request': function(config) {
45        // same as above
46     },
47 
48     'response': function(response) {
49        // same as above
50     }
51   };
52 });

此处有一个坑,在push时,提示未定义拦截器,因为$httpprovider在config 拦截器时,拦截器service 还不能找到,

可以将拦截器service 定义在config依赖的模块中使用。