更新记录

1.0.0(2019-07-09) 下载此版本

基于flyio接口封装,拦截器配置


平台兼容性

插件使用说明

  • 基于fly.js封装的http请求库,Fly.js 是一个基于 promise 的,轻量且强大的Javascript http 网络库,
  • flyio官网https://wendux.github.io/dist/#/doc/flyio/readme

1.安装flyio

复制代码npm install flyio --s

2.新建api目录,新建http.js,引入fly

复制代码let Fly = require("flyio/dist/npm/wx")
let fly = new Fly

3.全局请求配置

复制代码//设置超时
fly.config.timeout = 30000;
//设置请求基地址
fly.config.baseURL = 'uniapp.dcloud.io'
...

4.拦截器

复制代码// 添加请求拦截器
fly.interceptors.request.use((request) => {
    // 在发送请求之前做些什么
    let token = uni.getStorageSync('aliToken')
    if (token) {
        request.headers['token'] = token
    }
    return request
}, function(error) {
    // 对请求错误做些什么
    return Promise.reject(error)
})

// 添加响应拦截器
fly.interceptors.response.use((res) => {
    // 对响应数据做些事
    // if (!res.data) {
    // return Promise.reject(res)
    // }
    return res
}, (error) => {
    return Promise.reject(error)
})

5.添加api接口配置 新建home.js,引入fly

复制代码import fly from './http'

新增api接口配置

export function testFly(params){
    return fly.post('/test/test1', params).then(res => res)
}

新建index.js,引入配置的api接口

import * as user from './user'
import * as home from './home'
import * as wallet from './wallet'
import * as task from './task'
import Vue from 'vue'

//api返回结果,正确的状态
export const STATUS_OK = '000'

const api = {
    STATUS_OK: STATUS_OK,
    ...user,
    ...home,
    ...wallet,
    ...task
}

挂载api到全局

Vue.prototype.$api = api
export default api

mmain.js 引入api

import './api'

6.调用接口

复制代码this.$api.testFly().then(res => {
    console.log(res)
}).catch(err => {
    console.log(err)
})

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议
gavinDon

2020-10-19

使用fly.js支持打包成app吗

Guozx

2020-10-19

uni-request 不支持PATCH请求,请问作者您的这个支持PATCH请求吗?移动真机上是否可以呢?

960***@qq.com

2020-02-14

大大,有封装微信小程序上传图片的方法吗

461***@qq.com

2019-11-12

支持app端吗?

now007

2019-10-08

代码中的 (wx.request(con);)有bug,目前项目中使用的,打包成h5后,内嵌入app中,在ios上会报错的。报错在这里https://ask.dcloud.net.cn/question/80022。

111***@qq.com

2019-08-29

为啥拦截不住返回的数据

823***@qq.com

2019-08-26

http.js 里面应该将fly暴露出去吧,要不然home.js 中拿不到会报错

jasonho2433

2019-08-06

能否支持百度小程序?

174***@qq.com 2019-08-06

支持的

pnz***@163.com

2020-03-09

请问一下是否支持put请求?

174***@qq.com 2019-08-05

可以在拦截器里判断下url 比如: if(request.url.indexOf('/common/upload/image') != -1){ request.headers['authToken'] = token }

811***@qq.com

2019-07-27

nvue下,不能上传图片啊?因为nvue下没有FormData这个东西

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问