国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

詳解AngularJS中的http攔截

2019-11-20 10:36:35
字體:
來源:轉載
供稿:網友

http攔截,即$http服務允許我們與服務端交互,有時候我們希望在發出請求之前以及收到響應之后做些事情。
$httpProvider包含了一個interceptors的數組。

我們這樣創建一個interceptor。

app.factory('myInterceptor', ['$log', function($log){  $log.debug('');    var myInterceptor = {};    return myInterceptor;}])

接著注冊interceptor. 

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

以下是$http攔截的一些例子。

■ 攔截器中的異步操作

app.factory('myInterceotpr','someAsyncServcie', function($q, someAsyncServcie){  var requestInterceptor = {    request: function(config){      var deferred = %q.defer();      someAsyncService.doAsyncOperation().then(function(){        ...        deferred.resolve(config);      }, function(){        ...        deferred.resolve(config);      })      return deferred.promise;    }  };    return requestInterceptor;})

以上,是一個請求攔截,做了一個異步操作,根據異步操作的結果來更新config。

當然也有響應攔截。

app.factory('myInterceptor',['$q', 'someAsyncService', function($q, someAsyncSercice){  var responseInterceptor = {    response: function(response){      var deferred = $q.defer();      someAsyncService.doAsyncOperation().then(function(response){        ...        deferred.resolve(response);      }, function(response){        ...        deferred.resolve(response);      })      return deferred.promise;    }  };  return responseInterceptor;}])

■ Session攔截,請求攔截

服務端有2種類型的驗證,一個是基于cookie的,一種是基于token的。對于基于token驗證,當用戶登錄,獲取一個來自服務端的token,這個token在每一次請求時發送給服務端。

創建一個有關session的injector:

app.factory('sessionInjector',['SessionService', function(SessionService){  var sessionInjector = {    request: function(config){      if(!SessionService.isAnonymous){        config.headers['x-session-token'] = SessionService.token;      }      return config;    }  };    return sessionInjector;}])

可見,把從服務端返回的token放在了config.headers中。

注冊injector:

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

發出一個請求:

$http.get('');

攔截前大致是:

{  "transformRequest":[null],  "transformResponse":[null],  "method":"GET",  "url":"",  "headers":{    "Accept": "application/json, text/plain,*/*"  }}

攔截后,在headers中多兩個一個x-session-token字段:

{  "transformRequest":[null],  "transformResponse":[null],  "method":"GET",  "url":"",  "headers":{    "Accept": "application/json, text/plain,*/*",    "x-session-token":......  }}

■ 時間戳,請求和響應攔截

app.factory('timestampMarker',[function(){  var timestampMarker = {    request:function(config){      config.requestTimestamp = new Date().getTime();      return config;    },    response: function(response){      response.config.responseTimestamp = new Date().getTime();      return config;    }  };    return timestampMarker;}])

以上,在請求和響應時攔截,在config.requestTimestamp和config.responseTimestamp賦上當前的時間。

注冊攔截器:

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

然后在運用的時候可以算出請求響應所耗去的時間。

$http.get('').then(function(response){  var time = response.config.responseTime - response.config.requestTimestamp;  console.log('請求耗去的時間為 ' + time);}) 

■ 請求錯誤恢復,請求攔截

模擬一個請求攔截的錯誤情形:

app.factory('requestRejector',['$q', function($q){  var requestRejector = {    request: function(config){      return $q.reject('requestRejector');    }  };  return requestRejector;}])

攔截請求錯誤:

app.factory('requestRecoverer',['$q', function($q){  var requestRecoverer = {    requestError: function(rejectReason){      if(rejectReason === 'requestRejector'){        //恢復請求        return {          transformRequest:[],          transformResponse:[],          method:'GET',          url:'',          headers:{            Accept:'application/json, text/plain, */*'          }        };      } else {        return $q.reject(rejectReason);      }    }  };    return requestRecoverer;}])

注冊攔截器:

app.config(['$httpProvider', function($httpProvider){  $httpProvider.interceptors.push('requestRejector');  $httpProvider.interceptors.push('requestRecoverer');}]) 

■ Session錯誤恢復,響應攔截

app.factory('sessionRecoverer',['$q','$injector',function($q, $injector){ var sessionRecoverer = {  responseError: function(response){   //如果Session過期   if(response.status == 419){    var SessionService = $injector.get('SessionService');    var $http = $injector.get('$http');    var deferred = $q.defer();        //創建一個新的session    SessionService.login().then(deferred.resolve, deferred.reject);        return deferred.promise.then(function(){     reutrn $http(response.config);    })   }   return $q.reject(response);  } };  return sessionRecoverer;}])

以上就是本文的全部內容,希望對大家的學習有所幫助。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 疏附县| 绥滨县| 南丰县| 华池县| 岱山县| 华亭县| 阳信县| 陇西县| 崇信县| 娄烦县| 根河市| 湾仔区| 民勤县| 金阳县| 渝中区| 建阳市| 类乌齐县| 南部县| 绥滨县| 宁津县| 明溪县| 西贡区| 娄烦县| 绥阳县| 屏南县| 平昌县| 遵化市| 普兰店市| 万州区| 汉源县| 信阳市| 璧山县| 建阳市| 台北县| 北流市| 年辖:市辖区| 芷江| 和硕县| 西乡县| 买车| 聂拉木县|