在axios的请求拦截器里重新发起请求 url参数会拼接

Question

需求是接口请求超时在axios的响应拦截器里重新发起请求

代码如下:

axios.interceptors.response.use(response => {
 
}, error => {
    console.log(error.config)
    if(! error.config || ! error.config.retry) {
        return Promise.resolve(error.response)
    }
    error.config.__retryCount = error.config.__retryCount || 0
    if(error.config.__retryCount >= error.config.retry) {
        return Promise.resolve(error.response)
    } else {
        error.config.__retryCount += 1
    }
    var backoff = new Promise(resolve => {
        setTimeout(() => {
            resolve()
        }, error.config.retryDelay)
    })
    return backoff.then(r => {
        return axios(error.config)
    })
})

封装的axios 请求方法

export default {
    request(params = {method: 'post', path: "", params: {}}) {
        let p = {
            method: params.method,
            url: params.path,
            baseURL: process.env.NODE_HOST,
            timeout: 10,
            retry: 2,   // 重连次数
            retryDelay: 1,
            headers: {
                "Content-Type": "application/json;charset=UTF-8"
            }
        }
        if('put' == p.method || 'post' == p.method || patch == p.method) {
            p.data = params.params
        } else {
            p.params = params.params
        }
        return axios(p)
    }
}

request({method: "post", path: "home"}) 第一次调用 发起的请求地址是 /apis/home
第一次调用请求超时或出错 走到响应拦截器error 重新发起请求
第二次请求 我打印的error.config 里的url参数就会变成 /apis/apis/home
第三次请求 url 就会变成 /apis/apis/apis/home 不知道为什么会这样

Answer 1

有点怀疑你的baseURL是不是/apis

Answer 2

axios(config)每次请求都会把config.baseURL拼接到config.url前面，由于是重试，此处的config.url已经是拼接后的地址了，所以把config.baseURL置空即可。