使用encodeURI出现URI malformed报错?

今天在一个业务模块中遇到一个问题。在点击导出后出现了 **URI malformed **报错提示。

一开始我以为是进行 encode 加密的时候将搜索对象进行了 JSON 序列化导致的。然后就将 JSON.stringify 去掉了,发现还是不行。

然后经过排查发现只有在查询条件 Name 字段输入值后,点击导出才会报错。对比发现 **Name **字段相比其他字段多加上了 % 的前缀和后缀,把 % 去掉之后发现一切正常。

然后查找后发现浏览器在对 % 执行 **decodeURI、decodeURIComponent、encodeURI、encodeURIComponent **的时候会报错。因为 % 在浏览器属于不安全字符。如下:

不安全符号 解释
空格 Url在传输的过程,或者用户在排版的过程,或者文本处理程序在处理Url的过程,都有可能引入无关紧要的空格,或者将那些有意义的空格给去掉
引号以及<> 引号和尖括号通常用于在普通文本中起到分隔Url的作用
# 通常用于表示书签或者锚点
% 百分号本身用作对不安全字符进行编码时使用的特殊字符,因此本身需要编码
{}\^[]`~ 某一些网关或者传输代理会篡改这些字符

所以只需要将 % 转义为 %25 或者直接将 % 替换掉。具体的实现办法如下,可以看实际的需求来操作。

const str = "50%";
const newStr = str.replace(/%/g, "");

或者

const str = "50%";
const newStr = str.replace(/%/g, '%25');

或者

decodeURI(escape(字符串))