当前位置: 首页 > article >正文

axios get 请求 url 转码 空格转成+,导致请求失败(前端解决)

问题

GET 请求参数: 

URL-encoded 后: 

 浏览器将空格转成了+,导致服务报错,返回 400。

解决

在请求拦截器中,对 params 进行处理。

axios.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;
  });


URL中的空格有时候被编码成%20,有时候被编码成加号+。

W3C标准规定,当Content-Type为application/x-www-form-urlencoded时,URL中查询参数名和参数值中空格要用加号+替代,所以几乎所有使用该规范的浏览器在表单提交后,URL查询参数中空格都会被编成加号+。

而在另一份规范(RFC 2396,定义URI)里, URI里的保留字符都需转义成%HH格式(Section 3.4 Query Component),因此空格会被编码成%20,加号+本身也作为保留字而被编成%2B,对于某些遵循RFC 2396标准的应用来说,它可能不接受查询字符串中出现加号+,认为它是非法字符。所以一个安全的举措是URL中统一使用%20来编码空格字符。


http://www.kler.cn/a/230186.html

相关文章:

  • 第3章:Go语言复合数据类型
  • 反规范化带来的数据不一致问题的解决方案
  • NRC优先级中比较特殊的—NRC0x13和NRC0x31
  • vue3运行时执行过程步骤
  • 二维数组:求最大元素及其所在的行坐标及列坐标(PTA)C语言
  • 随机置矩阵列为0[矩阵乘法pytorch版]
  • 备战蓝桥杯---搜索(进阶3)
  • Unicode常用属性
  • WebChat——一个开源的聊天应用
  • 阿里云游戏服务器收费价格表,一年和1个月报价
  • Unity动画循环偏移的使用
  • Idea:Idea导入Module、子Module的方式及其可能遇到的问题
  • 【Flink入门修炼】1-2 Mac 搭建 Flink 源码阅读环境
  • 【python】绘制爱心图案
  • Docker 面试题 100 道
  • openkylin(Debian系)安装nginx及安装前需要的准备
  • canvas缩放坐标系(scale)
  • Mac上新版InfluxDB使用教程
  • 鸿蒙(HarmonyOS)项目方舟框架(ArkUI)之Rating组件
  • SpringBoot+随机盐值+双重MD5实现加密登录
  • Qt环境搭建+简单程序实现
  • IDEA JDBC配置
  • uniCloud ---- schema2code
  • #免费 苹果M系芯片Macbook电脑MacOS使用Bash脚本写入(读写)NTFS硬盘教程
  • APIfox自动化编排场景(二)
  • 为什么要用建造者模式