mpvue中使用flyjs全域攔截

標籤：load   ons   col   promise   one   使用者登陸   pre   hide   tor   

mpvue全域屬性設定，在我之前的文章中有介紹，今天想記錄的就是怎麼和Fly.js結合使用來實現全域攔截功能：

首先我們要安裝好Flyio，在mpvue項目中我們用npm下載安裝：

npm install flyio

找到src檔案夾下面的main.js檔案（就在src下）

引入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

 

mpvue中使用flyjs全域攔截