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拦截器 统一处理数据请求的更多相关文章

  1. angular 用拦截器统一处理http请求和响应 比如加token

    想使用angularjs里的htpp向后台发送请求,现在有个用户唯一识别的token想要放到headers里面去,也就是{headres:{'token':1}} index.html里引入以下js: ...

  2. (转)Angular中的拦截器Interceptor

    什么是拦截器? 异步操作 例子 Session 注入(请求拦截器) 时间戳(请求和响应拦截器) 请求恢复 (请求异常拦截) Session 恢复 (响应异常拦截器) 转之:http://my.osch ...

  3. AngularJS 拦截器实现全局$http请求loading效果

    日常项目开发中,当前端需要和后端进行数据交互时,为了友好的UI效果,一般都会在前端加个loading的状态提示(包括进度条或者icon显示),数据传输或交互完成之后,再隐藏/删除loading提示. ...

  4. 解决SpringMVC拦截器中Request数据只能读取一次的问题

    解决SpringMVC拦截器中Request数据只能读取一次的问题 开发项目中,经常会直接在request中取数据,如Json数据,也经常用到@RequestBody注解,也可以直接通过request ...

  5. angular之interceptors拦截器

    <!DOCTYPE html> <html ng-app="nickApp"> <head> <meta charset="UT ...

  6. axios封装,使用拦截器统一处理接口

    1.项目路径下,引入axios.qs依赖 npm install axios npm install qs 2.在项目的src路径下新建一个commJs文件夹,在commJs文件夹里新建aps.js和 ...

  7. angular http interceptors 拦截器使用分享

    拦截器 在开始创建拦截器之前,一定要了解 $q和延期承诺api 出于全局错误处理,身份验证或请求的任何同步或异步预处理或响应的后处理目的,希望能够在将请求移交给服务器之前拦截请求,并在将请求移交给服务 ...

  8. Okhttp拦截器统一异常处理并多次读取response.body().string()

    参考:https://blog.csdn.net/a624806998/article/details/73863606 引言: 写这篇文章,因为在自己编写实现Http日志拦截器的时候,在拦截器中使用 ...

  9. Struts2 在登录拦截器中对ajax请求的处理

    前言: 由于ajax请求不像http请求,可以直接进行页面跳转,你返回的所有东西,ajax都只会识别为一个字符串. 之前尝试的方法是在拦截器中返回一个标识给ajax,然后再在每一个ajax请求成功之后 ...

随机推荐

  1. 用AngularJS实现对表格的增删改查(仅限前端)

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  2. 整理关于web项目如何防止CSRF和XSS攻击的方法

    1 了解CSRF的定义 CSRF(Cross-site request forgery)跨站请求伪造,也被称为"One Click Attack"或者Session Riding, ...

  3. lnmp一键安装的卸载

    http://blog.csdn.net/lansetiankong12/article/details/48130507  如果是lnmp一键安装的 进入安装包目录 [root@www home]# ...

  4. electron 学习笔记

    一.快速搭建一个electron 项目结构 # 克隆示例项目的仓库 $ git clone https://github.com/electron/electron-quick-start # 进入这 ...

  5. DedeCMS实现自定义表单提交后发送指定QQ邮箱法

    https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=monline_3_dg&wd=dedecms 邮箱&oq=d ...

  6. asp.net -mvc框架复习(1)-ASP.NET网站开发概述

    1.网站开发的基本步骤: 2.网站开发的需要的知识结构 (1)网站开发前台页面技术 页面设计:HTML  .CSS+DIV 页面特效:JavaScript.jQery (2)OOP编程核心公共技能 C ...

  7. Tomcat下的Server.xml配置文件详解

    自15年毕业到现在已经入行两年多了,一直以来没有深入的了解过tomcat的详细配置,只懂修改一下端口号.在网上找了些相关资料来支撑这篇文章,深入了解server.xml文件各配置的作用 <?xm ...

  8. HEXO+Github,搭建属于自己的博客

    摘录自:http://www.jianshu.com/p/465830080ea9 1. github的准备 账号 密码 建立Repository建立与你用户名对应的仓库,仓库名必须为[your_us ...

  9. mybatis if条件查询 及<号的问题

    摘录自:http://flt95.blog.163.com/blog/static/12736128920136185841551/ <if test="p=='1'"> ...

  10. mybatis-pageHelper做分页

    Mybatis-PageHelpera是一个很好的第三方分页插件,支持很多数据库,几乎主流的数据库都支持 github地址:https://github.com/pagehelper/Mybatis- ...