现象

最近在项目中遇到通过url传递json,后台通过request.getParameter获取到此参数，再传递到另一个vue项目应用。

url形如：

/#/default/list/aaaa/{"pagewNum":1,"seawrch":"","conditions":[{"index":"rrrr","value":{"dfesc":"33","path":"data.cowmpetentwDeptName.value","namee":"22","valwue":"111"}}]}?sys=bbb

为了避免浏览器默认解码行为，传递前对url进行两次编码[^为什么呢]，因为encodeURI不会对#进行编码，所以使用encodeURIComponent进行两次编码。

可以使用此网站：URL转码

两次转码后结果如下：

%252F%2523%252Fdefault%252Flist%252Faaaa%252F%257B%2522pagewNum%2522%253A1%252C%2522seawrch%2522%253A%2522%2522%252C%2522conditions%2522%253A%255B%257B%2522index%2522%253A%2522rrrr%2522%252C%2522value%2522%253A%257B%2522dfesc%2522%253A%252233%2522%252C%2522path%2522%253A%2522data.cowmpetentwDeptName.value%2522%252C%2522namee%2522%253A%252222%2522%252C%2522valwue%2522%253A%2522111%2522%257D%257D%255D%257D%253Fsys%253Dbbb

java获取到如下：

%2F%23%2Fdefault%2Flist%2Faaaa%2F%7B%22pagewNum%22%3A1%2C%22seawrch%22%3A%22%22%2C%22conditions%22%3A%5B%7B%22index%22%3A%22rrrr%22%2C%22value%22%3A%7B%22dfesc%22%3A%2233%22%2C%22path%22%3A%22data.cowmpetentwDeptName.value%22%2C%22namee%22%3A%2222%22%2C%22valwue%22%3A%22111%22%7D%7D%5D%7D%3Fsys%3Dbbb

传递到后天前浏览器进行了一次解码。

问题出在后台接收到的字符串，假设如下：

％2F％23％2Fdefault％2Flist％2Fmxjiufeng％2F％7B％22a％22％3A11％7D％3Fsys％3Dcas

这里面百分号**%**发生了变化，导致传递到前台json解析失败。

为什么百分号这个字符发生变化了呢？发生变化的时间点是浏览器解码还是java接收的时候？

现在没有具体弄明白，待续…

解决

在上面举的那些例子中，特殊字符就那么多，出问题的只是一个百分号，所以在使用处进行了全局替换，str = str.replace(/％/g, ‘%’)

然后在decodeURIComponent(str)，可以得到正确结果。

浏览器默认解码

即：传递url前，只进行一次decodeURIComponent，浏览器会自动解析