当前位置: 首页 > 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

相关文章:

  • js中this的指向问题
  • 研0找实习【学nlp】15---我的后续,总结(暂时性完结)
  • Ubuntu安装不同版本的opencv,并任意切换使用
  • Oracle SQL优化②——访问路径
  • C++中的原子操作:原子性、内存顺序、性能优化与原子变量赋值
  • C++设计模式行为模式———状态模式
  • 备战蓝桥杯---搜索(进阶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自动化编排场景(二)
  • 为什么要用建造者模式