丶平上 / VUE / vue http.js

分享

   

vue http.js

2018-08-08  丶平上
import axios from 'axios'
import qs from 'qs'
import appData from './AppData'

var Http = {
defaultTimeout: 20000
}

Http.ErrorCode = {
NOT_NETWORK: -1, // 无网络,服务器无响应
SERVICE_ERROR: -2, // 服务器错误,请求错误返回码不为:200
PARSER_ERROR: -3, // 接口解析错误
API_ERROR: -4, // 接口错误status不为:0
REQUEST_ERROR: -5 // 请求之前错误,
}

/**
*
* @param error error对象
* @param errorCode Http.ErrorCode
* @param request 请求对象
* @param response 响应对象
* @returns {*}
* @constructor
*/
var creatHttpError = function (error, errorCode, request, response) {
if (!error) {
error = new Error()
}
error.errorCode = errorCode

if (request) {
error.request = request
}

if (response) {
error.response = response
}
return error
}

// 创建新的实例
var axiosNew = axios.create({ timeout: Http.defaultTimeout})
axiosNew.defaults.withCredentials = true

// POST传参序列化(添加请求拦截器)
axiosNew.interceptors.request.use(
config => {
config.headers = {
// 'X-Requested-With': 'XMLHttpRequest',
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
}
// 在发送请求之前做某件事
if (
config.method === 'post' ||
config.method === 'put' ||
config.method === 'delete'
) {
// 序列化
config.data = qs.stringify(config.data)
}
return config
},
error => {
let httpError = creatHttpError(error, Http.ErrorCode.REQUEST_ERROR, error.request, error.response)
return Promise.reject(httpError)
}
)

// 返回状态判断(添加响应拦截器)
axiosNew.interceptors.response.use(
res => {
// 对响应数据做些事
if (res.status == 200) {
if (res.data.state == 0) {
return res.data.data
} else {
// 接口state不为0

let httpError = creatHttpError(new Error('Api Error:' + res.data.data), Http.ErrorCode.API_ERROR, res.request, res)
return Promise.reject(httpError)
}
} else {
let httpError = creatHttpError(new Error('Server Error:' + res.status), Http.ErrorCode.SERVICE_ERROR, res.request, res)
return Promise.reject(httpError)
}
},
error => {
if (error.response) {
// 服务器有响应
let httpError = creatHttpError(error, Http.ErrorCode.SERVICE_ERROR, error.request, error.response)
return Promise.reject(httpError)
} else {
// 无网络或者服务器无响应
let httpError = creatHttpError(error, Http.ErrorCode.NOT_NETWORK, error.request, error.response)
return Promise.reject(httpError)
}
}
)

/**
this.$http.post(url,data).then((data)=>{

}).catch((error)=>{

})

*
* @param url
* @param data
* @returns {Promise<any>}
*/
Http.post = function (url, data) {
return new Promise(function (resolve, reject) {
axiosNew.post(url, data).then(function (data) {
resolve(data)
}).catch(function (error) {
console.log('http-post-error:', error)
reject(error)
})
})
}

/**
this.$http.get(url,data).then((data)=>{

}).catch((error)=>{

})

*
* @param url
* @param data
* @returns {Promise<any>}
*/
Http.get = function (url, params) {
return new Promise(function (resolve, reject) {
axiosNew.get(url, {params: params}).then(function (data) {
resolve(data)
}).catch(function (error) {
console.log('http-get-error:', error)
reject(error)
})
})
}

/**
* 延时请求,等下次页面加载再去请求,跳转页面上报功能一般用这个
* @param url
* @param data
*/
Http.postWhenFreeTime = function (url, data) {
// let requests = storage.getLocal('postWhenFreeTime',[])
// requests.push({url:url,data:data})
// storage.setLocal('postWhenFreeTime',requests)

let requests = appData.postWhenFreeTime
requests.push({url: url, data: data})
}

/**
* 激活上报
*/
Http.startPost = function () {
// setTimeout(function () {
// let requests = storage.getLocal('postWhenFreeTime',[])
// if(requests.length>0){
// let request = requests.shift()
// storage.setLocal('postWhenFreeTime',requests)
// Http.post(request.url,request.data).finally(function () {
// Http.startPost()
// })
// }
// },1000)

setTimeout(function () {
let requests = appData.postWhenFreeTime
if (requests.length > 0) {
let request = requests.shift()
Http.post(request.url, request.data).finally(function () {
Http.startPost()
})
}
}, 1000)
}

module.exports = Http

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。

    来自: 丶平上 > 《VUE》

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多
    喜欢该文的人也喜欢 更多

    ×
    ×

    ¥.00

    微信或支付宝扫码支付:

    开通即同意《个图VIP服务协议》

    全部>>