mpvue中使用flyjs全局拦截

 

我们安装好flyio之后

npm install flyio

找到src目录下的main.js文件

首先引入flyjs并实例化

var Fly=require("flyio/dist/npm/wx")
var fly=new Fly

比方说我们每次请求我们自己的服务器接口的时候需要带上appID，用户登陆后需要带上openId

// 请求拦截
fly.interceptors.request.use((request)=>{

  request.body.appId = 'xxx'
    // 用户的openId在获取之后添加到全局变量中如果存在，我们将它添加到请求参数里面
  let openId = Vue.prototype.globalData.openId;
  if(openId){
    request.body.openId = openId
  }
})

当服务器发生错误，或者用户网络错误导致请求失败的时候，我们可以添加一个响应拦截

// 响应拦截
fly.interceptors.response.use(
  (response) => {


  },
  (err) => {
    //发生网络错误后会走到这里
    //return Promise.resolve("ssss")
    wx.hideLoading();
    wx.showToast({
      title:'网络不流畅，请稍后再试！',
      icon:'none',
    });

  })

最后将flyjs挂载到vue的原型上

// 将fly挂载在Vue的原型上
Vue.prototype.$flyio = fly

不同页面直接使用this.$flyio请求（是不是很方便）

这是我个人开发的小程序，欢迎一起交流学习

欢迎指正错误