如何防止Axios在baseURL后添加斜杠

2ul0zpep  于 2022-11-05  发布在  iOS
关注(0)|答案(1)|浏览(353)

在我的Vue应用程序中,我将axios配置放到了一个单独的文件 * config.js * 中。

  • config.js* 的内容
import axios from "axios";
const token = localStorage.getItem('user-token');
const baseUrl = `/api/v2.1/document.json&token=${token}&`;

export default () => {
    return axios.create({
        baseURL: baseUrl
    })
}

在我的Vuex存储模块 formFields.js 中,我有:

import Api from '../../api/config';

// ...

const actions = {
    async getApiFields() {
        await Api().get('type=documentType').then(function(response){
            console.log(response);
        }).catch(e => {
            this.errors.push(e)
        });
    }
};

我不知道为什么axios要加“/
请求URL:我的意思是说,如果你是一个人的话,那么你就应该是一个人的朋友,而不是一个人的朋友。
Network tab screenshot here
如何防止添加此斜线?

s3fp2yjn

s3fp2yjn1#

tl;dr使用axios拦截器

组合默认和附加查询参数时出现问题

axios.create的配置对象中使用字段params,如
第一个

问题是你不能添加额外的查询参数,因为它们会覆盖默认的查询参数。因此,要解决这个问题,你可以添加一个axios拦截器,它会向每个请求添加token查询参数。

解决方案:使用axios拦截器

第一个
使用这样的拦截器,将产生如下的请求(在本例中):
/api/v2.1/document.json?token=XXX&type=documentType
有关拦截器的更多信息,请访问:https://github.com/axios/axios#interceptors

相关问题