ionic2+Angular 使用HttpInterceptorService拦截器 统一处理数据请求
sstep1:新建http-Interceptor.ts文件
import { Injectable } from '@angular/core';
import { HttpInterceptorService } from 'ng-http-interceptor';
import { Observable } from 'rxjs';
import { URLService } from './urls';
import { MsgBarService } from './msg-bar';
@Injectable()
export class HttpIntService {
constructor(public httpservice: HttpInterceptorService, public urlservice: URLService, private ms: MsgBarService) {
httpservice.request().addInterceptor((data, method, option) => {
data[0] = this.urlservice.getUrl(data[0]);//地址拼接
return data;
})
httpservice.response().addInterceptor(response => {
return response.map(result => {
var json = result.json();
if (json.state && json.state.code == 200) {
return result;// 返回请求结果
} else if (json.state && json.state.code == 600) {
//兑换商品是积分不足
// return result;
} else {
this.ms.showError(json.state.msg);//统一处理返回的提示信息
}
// //返回状态
throw json.state.msg;
}).catch(error => {
if (typeof error === 'string') {
this.ms.showError(error);
}
else if (error != response) {
response.subscribe(p => {
this.ms.showError('服务器发生错误');
})
}
else {
this.ms.showError('服务器发生错误');
}
return Observable.throw(error)
})
})
}
}
step2:在app.module.ts文件中添加HttpIntService,并且在构造器中添加。
@NgModule({
declarations: [
MyApp,
TabsPage,
],
imports: [
BrowserModule,
HttpModule,
HttpInterceptorModule,
IonicModule.forRoot(MyApp,{
backButtonText:'',
backButtonIcon:'jf-arrow-back',//自定义返回按钮图标
iconMode:'ios',//统一图标样式
mode: 'ios',//Android和iOS模式统一
menuType:'reveal',
pageTransition:'ios-transition',
tabsHideOnSubPages:true,
preloadModules: true
})
],
bootstrap: [IonicApp],
entryComponents: [],
providers: [
StatusBar,
SplashScreen,
HttpIntService,
URLService,
HttpInterceptorService,
WechatService,
{ provide: ErrorHandler, useClass: IonicErrorHandler }
]
})
export class AppModule {
constructor(_:HttpIntService){
}
}
ionic2+Angular 使用HttpInterceptorService拦截器 统一处理数据请求的更多相关文章
- angular 用拦截器统一处理http请求和响应 比如加token
想使用angularjs里的htpp向后台发送请求,现在有个用户唯一识别的token想要放到headers里面去,也就是{headres:{'token':1}} index.html里引入以下js: ...
- (转)Angular中的拦截器Interceptor
什么是拦截器? 异步操作 例子 Session 注入(请求拦截器) 时间戳(请求和响应拦截器) 请求恢复 (请求异常拦截) Session 恢复 (响应异常拦截器) 转之:http://my.osch ...
- AngularJS 拦截器实现全局$http请求loading效果
日常项目开发中,当前端需要和后端进行数据交互时,为了友好的UI效果,一般都会在前端加个loading的状态提示(包括进度条或者icon显示),数据传输或交互完成之后,再隐藏/删除loading提示. ...
- 解决SpringMVC拦截器中Request数据只能读取一次的问题
解决SpringMVC拦截器中Request数据只能读取一次的问题 开发项目中,经常会直接在request中取数据,如Json数据,也经常用到@RequestBody注解,也可以直接通过request ...
- angular之interceptors拦截器
<!DOCTYPE html> <html ng-app="nickApp"> <head> <meta charset="UT ...
- axios封装,使用拦截器统一处理接口
1.项目路径下,引入axios.qs依赖 npm install axios npm install qs 2.在项目的src路径下新建一个commJs文件夹,在commJs文件夹里新建aps.js和 ...
- angular http interceptors 拦截器使用分享
拦截器 在开始创建拦截器之前,一定要了解 $q和延期承诺api 出于全局错误处理,身份验证或请求的任何同步或异步预处理或响应的后处理目的,希望能够在将请求移交给服务器之前拦截请求,并在将请求移交给服务 ...
- Okhttp拦截器统一异常处理并多次读取response.body().string()
参考:https://blog.csdn.net/a624806998/article/details/73863606 引言: 写这篇文章,因为在自己编写实现Http日志拦截器的时候,在拦截器中使用 ...
- Struts2 在登录拦截器中对ajax请求的处理
前言: 由于ajax请求不像http请求,可以直接进行页面跳转,你返回的所有东西,ajax都只会识别为一个字符串. 之前尝试的方法是在拦截器中返回一个标识给ajax,然后再在每一个ajax请求成功之后 ...
随机推荐
- setTimeout,setInterval运行原理
function a() { setTimeout(function(){alert(1)},0); alert(2); } a(); 和其他的编程语言一样,Javascript中的函数调用也是通 ...
- DTD约束
DTD约束 一,导入DTD方式 二,DTD语法 2)DTD语法 约束标签 <!ELEMENT 元素名称类别>或<!ELEMENT 元素名称(元素内容)> 类别: 空标签: ...
- VUE之ECMAScript6(es6)
es6:es:EMCAScript 6 (es2015)Emca:国际标准组织 1.常量和变量 const a = "hello" let:定义一个块级作用域的变量 需要先定义再使 ...
- 使用WinDbg获取SSDT函数表对应的索引再计算得出地址
当从Ring3进入Ring0的时候会将所需要的SSDT索引放入到寄存器EAX中去,所以我们这里通过EAX的内容得到函数在SSDT中的索引号,然后计算出它的地址首先打开WinDbug,我们以函数ZwQu ...
- RocketMQ环境搭建(双master模式)
介绍: 多Master模式,一个集群无Slave,全是Master,例如2个Master或者3个Master. 优点:配置简单,单个Master宕机或重启维护对应用无影响,在磁盘配置为RAID10时, ...
- centos下配置sftp且限制用户访问目录[转]
第一步:创建sftp服务用户组,创建sftp服务根目录 groupadd sftp #此目录及上级目录的所有者(owner)必须为root,权限不高于755,此目录的组最好设定为sftp mkdir ...
- underscore.js 源码阅读 准备
本次阅读是初次阅读源码,参考了以下几篇文章: https://github.com/hanzichi?language=javascript&page=5&tab=stars http ...
- linux ssh登录的小知识
查看服务器的各个端口: # netstat -tulnp 或者 #netstat -tnip 筛选在后面添加 |grep *** 准许root登录 #vi /etc/ssh/sshd_config 找 ...
- Log4j源码解析--核心类解析
原文出处:http://www.blogjava.net/DLevin/archive/2012/06/28/381667.html.感谢上善若水的无私分享. 在简单的介绍了Log4J各个模块类的作用 ...
- 07_jquery入门第一天
视频来源:麦子学院 讲师:魏畅然 补充:JSON.stringify()函数 [https://www.cnblogs.com/damonlan/archive/2012/03/13/2394787. ...