文章参考
http://my.oschina.net/ilivebox/blog/290881
在工作中,遇到一个需求 —— 如何判断用户是否已经登录,session是否有效。
思路一:
第一次进来获取登录用户信息,然后缓存到一个服务中,使用拦截器每次发送请求,就传递用户信息给后台
思路二:
用户输入个人账号信息登录,然后每次利用拦截器接受后台返回的响应结果,根据响应结果判断是否session是否有效
概念:
$httpProvider 中有一个 interceptors 数组,而所谓拦截器只是一个简单的注册到了该数组中的常规服务工厂。
-
通过实现
request
方法拦截请求: 该方法会在$http
发送请求道后台之前执行,因此你可以修改配置或做其他的操作。该方法接收请求配置对象(request configuration object)作为参数,然后必须返回配置对象或者promise
。如果返回无效的配置对象或者 promise 则会被拒绝,导致$http
调用失败。 -
通过实现
response
方法拦截响应: 该方法会在$http
接收到从后台过来的响应之后执行,因此你可以修改响应或做其他操作。该方法接收响应对象(response object)作为参数,然后必须返回响应对象或者promise
。响应对象包括了请求配置(request configuration),头(headers),状态(status)和从后台过来的数据(data)。如果返回无效的响应对象或者 promise 会被拒绝,导致$http
调用失败。 -
通过实现
requestError
方法拦截请求异常: 有时候一个请求发送失败或者被拦截器拒绝了。请求异常拦截器会俘获那些被上一个请求拦截器中断的请求。它可以用来恢复请求或者有时可以用来撤销请求之前所做的配置,比如说关闭进度条,激活按钮和输入框什么之类的。 -
通过实现
responseError
方法拦截响应异常: 有时候我们后台调用失败了。也有可能它被一个请求拦截器拒绝了,或者被上一个响应拦截器中断了。在这种情况下,响应异常拦截器可以帮助我们恢复后台调用。
/** * 定义ApiService服务 * 功能:专门向服务器发送post 和 get请求 * */ angular.module('huangbiaoApp') .factory('sessionInteceptor', function() { var myInterceptor = {}; //该方法接收请求配置对象(request configuration object)作为参数,然后必须返回配置对象或者 promise 。 myInterceptor.request = function(requestConfig){ console.log("myInterceptor.request : " + requestConfig); return requestConfig; }; //该方法接收响应对象(response object)作为参数,然后必须返回响应对象或者 promise。 myInterceptor.response = function(responseObject){ console.log("myInterceptor.response : " + responseObject); return responseObject; }; myInterceptor.requestError = function(rejectReason){ var deferred = $q.defer(); console.log("myInterceptor.requestError : " + responseObject); return deferred.promise; }; myInterceptor.responseError = function(responseError){ console.log("myInterceptor.responseError : " + responseObject); return {}; }; return myInterceptor; });
备注:
1、注意拦截器request 和 response 的参数分别是请求对象 和 响应对象
2、注意拦截器request 和 response 的返回值是 对象 或者是 promise对象
/** * 添加拦截器 * */ angular.module('huangbiaoApp') .config(function ($stateProvider, $ionicConfigProvider,$httpProvider) { //禁用所有缓存 $ionicConfigProvider.views.maxCache(0); //添加拦截器 $httpProvider.interceptors.push('sessionInteceptor'); $stateProvider //首页 .state('index', { url: '/index', templateUrl: 'templates/wap/indexContent.html', controller: "indexController" }) //其他页面 .state('one_page', { url: '/one_page', templateUrl: 'templates/wap/onePage.html', controller: "onepageController" }) });
angular 拦截器 不能注入 $state $http等信息,否则会爆出“循环依赖”错误,导致应用起不来.