vue + axios config url 转码空格转成+，导致请求失败（前端解决）

最新推荐文章于 2024-07-17 10:07:33 发布

zlting~

最新推荐文章于 2024-07-17 10:07:33 发布

阅读量3.9k

点赞数 1

分类专栏： VUE 文章标签： axios 转码

本文链接：https://blog.csdn.net/sunshineTing2/article/details/113884138

版权

VUE 专栏收录该内容

114 篇文章 15 订阅

订阅专栏

在请求中如果url包括特殊字符的话，可能会导致接口接收参数失败(例：空格被转换成 + 号)，所以前端一般会对特殊字符进行encode

在这里插入图片描述

encodeURI 对一个完整的URI 进行编码，

而encodeURIComponent对URI 的一个组件（单个参数）进行编码。浏览器get请求

service.interceptors.request.use(config => {
let url = config.url
    if (config.method === 'get' && config.params) {
        url += '?' // 拼接参数
        // 获取所有参数，通过循环 拼接所有参数，encodeURIComponent对参数编码，
        Object.keys(config.params).map(key => {
            url += `${key}=${encodeURIComponent(config.params[key])}&`
        })
        url = url.substring(0, url.length - 1) // 删除最后一个&字符
        config.params = {} // 参数已经存在于 url中
    }
    config.url = url
    return config
}