谁有 Http.js 的源码 可以发一下吗
谁有 Http.js 的源码 可以发一下吗
谁有 Http.js 的源码 可以发一下吗
2020-04-03
import axios from 'axios'
import service from './contactApi'
import { Toast } from 'vant'
// 1.service 循环遍历出不同的请求方法
let instance = axios.create({
// 注意地址的拼写
baseURL: 'http://localhost:9000/api',
timeout: 1000
})
let Http = {}; //包裹请求方法的容器
// 2.请求格式或者参数的统一
for (let key in service) {
let api = service[key]; // url method
console.log(api)
console.log(key)
// async的作用:避免进入回调地狱
Http[key] = async function (
params, // 请求参数 get(url),put,post,,patch(data),delete(url)
isFormdata = false, // 判断是否是form-data请求
config = {} //配置参数
) {
// let url = api.url
let newParams = {}
// 3.content-type是否是form-data的判断
if (params && isFormdata) {
newParams = new FormData();
for (let i in params) {
// 转换form-data的格式
newParams.append(i, params[i]);
}
} else {
newParams = params;
}
// 4.不同的请求判断
let response = {}; //请求的返回值
if (api.method === 'put' || api.method === 'post' || api.method === 'patch') {
try {
response = await instance[api.method](api.url, newParams, config);
} catch (err) {
response = err;
}
} else if (api.method === 'delete' || api.method === 'get') {
try {
config.params = newParams;
response = await instance[api.method](api.url, config);
} catch (err) {
response = err;
}
}
return response; // 返回响应值
}
}
// 拦截器的添加
// 5.请求拦截器
instance.interceptors.request.use(
// 发起请求前
config => {
Toast.loading({
mask: true, //是否显示阴影
duration: 0, // 0是一直存在阴影,默认的是1000ms
forbidClick: true, //禁止点击
message: '加载中...'
})
return config
},
// 请求失败
() => {
Toast.clear()
Toast('请求错误,请稍后重试')
}
)
// 6.响应拦截器
instance.interceptors.response.use(
// 请求成功
res => {
Toast.clear()
return res.data
},
() => {
Toast.clear()
Toast('请求错误,请稍后重试')
}
)
export default Http
import axios from 'axios'import service from './contactApi'import { Toast } from 'vant'// 1.service 循环遍历出不同的请求方法let instance = axios.create({ // 注意地址的拼写 baseURL: 'http://localhost:9000/api', timeout: 1000})let Http = {}; //包裹请求方法的容器// 2.请求格式或者参数的统一for (let key in service) { let api = service[key]; // url method console.log(api) console.log(key) // async的作用:避免进入回调地狱 Http[key] = async function ( params, // 请求参数 get(url),put,post,,patch(data),delete(url) isFormdata = false, // 判断是否是form-data请求 config = {} //配置参数 ) { // let url = api.url let newParams = {} // 3.content-type是否是form-data的判断 if (params && isFormdata) { newParams = new FormData(); for (let i in params) { // 转换form-data的格式 newParams.append(i, params[i]); } } else { newParams = params; } // 4.不同的请求判断 let response = {}; //请求的返回值 if (api.method === 'put' || api.method === 'post' || api.method === 'patch') { try { response = await instance[api.method](api.url, newParams, config); } catch (err) { response = err; } } else if (api.method === 'delete' || api.method === 'get') { try { config.params = newParams; response = await instance[api.method](api.url, config); } catch (err) { response = err; } } return response; // 返回响应值 }}// 拦截器的添加// 5.请求拦截器instance.interceptors.request.use( // 发起请求前 config => { Toast.loading({ mask: true, //是否显示阴影 duration: 0, // 0是一直存在阴影,默认的是1000ms forbidClick: true, //禁止点击 message: '加载中...' }) return config }, // 请求失败 () => { Toast.clear() Toast('请求错误,请稍后重试') } )// 6.响应拦截器instance.interceptors.response.use( // 请求成功 res => { Toast.clear() return res.data }, () => { Toast.clear() Toast('请求错误,请稍后重试') })export default Http
举报