背景： 在解析后端的短链上的url时，发现解析出来的值并不正确
-
网页url：
http://localhost:8081/client-cancel?id=ikQXQ7No7AwjeJU1%20qNW%20YQt9OGH4K3Tmg6%2F%2FzwuJnk%3D -
解析结果：
- 正确结果： 'id=ikQXQ7No7AwjeJU1%20qNW%20YQt9OGH4K3Tmg6%2F%2FzwuJnk%3D'
第一想法是编码的问题，虽然我不懂这个机制哈，而且方法用的也不多，还是去查了encodeURIComponent、encodeURI、decodeURI和decodeURIComponent。尝试之后并不可以
最后确认前端无法处理这个问题，选择让后端采用base64对url进行编码
不过还是学到了以下几点
🌰 [踩坑系列]URLEncode 中对 空格的编码有 “+”和“%20”两种
空格被编码成加号+的情况只会在查询字符串部分出现，而被编码成%20则可以出现在路径和查询字符串中。
转义主要是避免混淆和显示 编码是统一信息的传递，避免解析错误 加密是安全性
后来我又遇到另一个类似的问题：在get请求时，参数值为多个系统的id值，但是却出现了解析错误，导致我们只能取到第一个系统id值，示例如下
// 接口地址
export const getUserPermission = (params: any): Promise<any> => {
return request({
url: '/api/inneruserproject/v001/auth/page/query_auths',
params,
});
};
// 发起请求的代码
effects: {
*getUserPermission(_, { call, put }) {
const response = yield call(getUserPermission, {
subsys: '2, 65, 60',
});
// response处理函数......
}
}
浏览器中的请求地址Request URL: http://api-gateway.medbanks-test.com/api/inneruserproject/v001/auth/page/query_auths?subsys=2,+65,+60
payload
该问题的原因上文已提到，就是查询字符串中的空格会被编译成+，而造成该结果的代码就是subsys: '2, 65, 60',习惯了eslint的格式，逗号后面都加了空格
