使用AngularJS的拦截器

AngularJS设置拦截器

在日常的web开发工程中,我们通常会在后台创建拦截器或者过滤器进行一些统一的权限控制或者统一编码等操作。然而当我们将前后端完全分离开之后( 前端只有JS代码,后端只有Java活着.net等一类语言代码 ),这个时候我们会有一些需求需要在前端统一进行处理,比如:统一一处地方处理系统错误代码,在一个地方对客户端所产生的请求进行状态处理。
其实 AngularJS 给我们提供了这么一个功能,即 拦截器 。对于AngularJS提供的拦截器可以从以下两个步骤出发进行使用。

针对我们的页面应用(module)创建APP

blapp.factory('blInterceptor', ["$cookies","$q","$rootScope",function ($cookies,$q,$rootScope) {
    var interceptor = {
        request: function (config) {
            //将COOKIE中纪录的状态数据每次请求时发送给后台
            config.headers["X-User-Id"] = $cookies.get("baid");
            config.headers["X-Token"] = $cookies.get("btoken")
            return config;
        },
        response: function(response) {
            if(response.data != null && response.data.code != 0){

                }
            }
            return response || $q.when(response);
        },
        responseError: function(response){
            console.log('responseError:' + response);
            if (response.status === 401) {
                authService.clear();
                window.location.href="#/login";
                return;
            }
            return $q.reject(response);
        }
    };
    return interceptor;

}])

将第一步中创建的拦截器配置在前端系统中

app.config(function ($httpProvider) {
    $httpProvider.interceptors.push('blInterceptor');
  }
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

不爱运动的跑者

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值