axios 自定义配置
1、api.request.jsimport axios from 'axios'// import store from '@/store'/*添加错误监控*/const addErrorLog = errorInfo => {const { statusText, status, request: { responseURL } } = errorInfolet...
·
1、api.request.js
import axios from 'axios'
// import store from '@/store'
/*添加错误监控*/
const addErrorLog = errorInfo => {
const { statusText, status, request: { responseURL } } = errorInfo
let info = {
type: 'ajax',
code: status,
mes: statusText,
url: responseURL
}
if (!responseURL.includes('save_error_logger')) {
// 上报错误信息
// store.dispatch('addErrorLog', info)
console.log(info)
}
}
class HttpRequest {
constructor (baseUrl = baseURL) {
this.baseUrl = baseUrl
this.queue = {} //请求队列控制标记
}
getInsideConfig () {
const config = {
baseURL: this.baseUrl,
headers: {
//
'Content-Type': 'application/json;charset=UTF-8'
}
}
return config
}
destroy (url) {
delete this.queue[url]
if (!Object.keys(this.queue).length) {
// Spin.hide()
}
}
interceptors (instance, url) {
// 请求拦截
instance.interceptors.request.use(config => {
// 添加全局的loading...
if (!Object.keys(this.queue).length) {
// Spin.show() // 请求中Loading效果不建议开启,因为界面不友好
}
this.queue[url] = true
return config
}, error => {
return Promise.reject(error)
})
// 响应拦截
instance.interceptors.response.use(res => {
this.destroy(url)
const { data, status } = res
return { data, status }
}, error => {
this.destroy(url)
let errorInfo = error.response
if (!errorInfo) {
const { request: { statusText, status }, config } = JSON.parse(JSON.stringify(error))
errorInfo = {
statusText,
status,
request: { responseURL: config.url }
}
}
addErrorLog(errorInfo)
return Promise.reject(error)
})
}
request (options) {
const instance = axios.create()
options = Object.assign(this.getInsideConfig(), options)
this.interceptors(instance, options.url)
return instance(options)
}
}
export default HttpRequest
2、axios.js
import HttpRequest from '@/libs/axios'
// import config from '@/config'
// const baseUrl = process.env.NODE_ENV === 'development' ? config.baseUrl.dev : config.baseUrl.pro
const baseUrl = process.env.NODE_ENV === 'development' ? 'http://localhost:8090/' : '/';
const axios = new HttpRequest(baseUrl)
export default axios
3、调用示例 user.js
import axios from './lib/api.request'
export const Login = (userName, password) => {
return axios.request({
url: 'user/login',
data: {
userName,
password
}
})
}
更多推荐
已为社区贡献1条内容
所有评论(0)