封装mpvue请求文件
一、flyio是什么？
flyio.js 是一个基于 promise 的，轻量且强大的Javascript http 网络库
二、flyio的特点？
提供统一的 Promise API。
浏览器环境下，轻量且非常轻量 。
支持多种JavaScript 运行环境
支持请求／响应拦截器。
自动转换 JSON 数据。
支持切换底层 Http Engine，可轻松适配各种运行环境。
浏览器端支持全局Ajax拦截 。
H5页面内嵌到原生 APP 中时，支持将 http 请求转发到 Native。支持直接请求图片。
安装：
//安装 fly
npm i flyio --save
配置公共配置：
src/http/config.JS
/*
fly 配置文件
by:David 2018.6.14
*/
// 引入 fly
var Fly = require("flyio/dist/NPM/wx")
var fly = new Fly;
import config from '@/config'
// 配置请求基地址
// // 定义公共 headers
// fly.config.headers={xx:5,bb:6,dd:7}
// // 设置超时
fly.config.timeout = 20000;
// // 设置请求基地址
fly.config.baseURL = config.host
// 添加请求拦截器
fly.interceptors.request.use((request) => {
// 给所有请求添加自定义 header
request.headers["X-Tag"] = "flyio";
// 打印出请求体
// console.log(request.body)
// 终止请求
//var err=new Error("xxx")
//err.request=request
//return Promise.reject(new Error(""))
// 可以显式返回 request, 也可以不返回, 没有返回值时拦截器中默认返回 request
return request;
})
// 添加响应拦截器, 响应拦截器会在 then/catch 处理之前执行
fly.interceptors.response.use(
(response) => {
// 只将请求结果的 data 字段返回
return response.data
},
(err) => {
// 发生网络错误后会走到这里
//return Promise.resolve("ssss")
}
)
// Vue.prototype.$http=fly // 将 fly 实例挂在 vue 原型上
export default fly
配置个性设置:
src/http/API.JS
import fly from './config'
import qs from 'qs'
import config from '../config'
const host = config.host;
const appKey = config.appKey;
const appid = config.appid;
/**
* 接口模版 ====post
*
* export const test = params => {return fly.post(`${root}/xx/xx`, qs.stringify(params))};
*
* 接口模版 ====get
*
* export const test1 = function(){return fly.get(`${root}/API/getNewsList`)}
*
*
* 用法:
* 在 页面用引入 test
* import {test} from '../../http/API.JS'
*
* test(params).then(res=>{ console.log(res) })
*/
// 通用的 get 请求
export const get = (params) => {
return fly.get(`${host}${params.url}`, qs.stringify(params.data))
};
// 通用的 post 请求
export const post = (params) => {
return fly.post(`${host}${params.url}`, qs.stringify(params.data))
};
// 封装的登录请求, 根据后台接收方式选择是否加 qs.stringify
export const login = params => {
return fly.post('/login', params)
};
公共地址配置：
const host = 'http://xxx.xxx';
const appid = '';
const appKey = '';
const config = {
host,
appid,
appKey,
}
export default config
如果感觉有帮助留下一个宝贵的赞或者给小编一个赞赏！！
同时如果想了解更多内容可以关注下方公众号：
qrcode_for_gh_4effe528d112_258.jpg
