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请求成功之后 ... 
随机推荐
- 用AngularJS实现对表格的增删改查(仅限前端)
			<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ... 
- 整理关于web项目如何防止CSRF和XSS攻击的方法
			1 了解CSRF的定义 CSRF(Cross-site request forgery)跨站请求伪造,也被称为"One Click Attack"或者Session Riding, ... 
- lnmp一键安装的卸载
			http://blog.csdn.net/lansetiankong12/article/details/48130507 如果是lnmp一键安装的 进入安装包目录 [root@www home]# ... 
- electron 学习笔记
			一.快速搭建一个electron 项目结构 # 克隆示例项目的仓库 $ git clone https://github.com/electron/electron-quick-start # 进入这 ... 
- DedeCMS实现自定义表单提交后发送指定QQ邮箱法
			https://www.baidu.com/s?ie=utf-8&f=8&rsv_bp=1&tn=monline_3_dg&wd=dedecms 邮箱&oq=d ... 
- asp.net -mvc框架复习(1)-ASP.NET网站开发概述
			1.网站开发的基本步骤: 2.网站开发的需要的知识结构 (1)网站开发前台页面技术 页面设计:HTML .CSS+DIV 页面特效:JavaScript.jQery (2)OOP编程核心公共技能 C ... 
- Tomcat下的Server.xml配置文件详解
			自15年毕业到现在已经入行两年多了,一直以来没有深入的了解过tomcat的详细配置,只懂修改一下端口号.在网上找了些相关资料来支撑这篇文章,深入了解server.xml文件各配置的作用 <?xm ... 
- HEXO+Github,搭建属于自己的博客
			摘录自:http://www.jianshu.com/p/465830080ea9 1. github的准备 账号 密码 建立Repository建立与你用户名对应的仓库,仓库名必须为[your_us ... 
- mybatis if条件查询 及<号的问题
			摘录自:http://flt95.blog.163.com/blog/static/12736128920136185841551/ <if test="p=='1'"> ... 
- mybatis-pageHelper做分页
			Mybatis-PageHelpera是一个很好的第三方分页插件,支持很多数据库,几乎主流的数据库都支持 github地址:https://github.com/pagehelper/Mybatis- ... 
