前端Url 传参编码

背景

我遇到的问题是这样的

例如：
我的用户中心的项目是这样的URL

我的一个活动页的项目的URL是：

这个时候我需要进活动页报名，活动页是需要登录的

登录后必须返回活动页，

最终的连接跳转应该是这样的


但是这样跳转的URL在获取returnUrl时会出错  

所以需要对returnUrl的值进行编码

如下：
链接编码：encodeURIComponent()编码
链接解码：decodeURIComponent()解码


防止url加密传参有时候会出现Uncaught URIError: URI malformed的错误

跳转的时候处理如下：

window.location.href = decodeURIComponent(returnUrl.replace(/%/g,'%25'));//使用returnUrl 跳转时必须使用decodeURIComponent()解码

文字编码：escape()编码
文字解码：unescape()解码

链接编码：encodeURIComponent()编码
链接解码：decodeURIComponent()解码

在使用时你可以遇到这样的错误

Uncaught URIError: URI malformed

url​​加密​​传参有时候会出现Uncaught URIError: URI malformed的错误，这是因为你的url中包含了“%”字符，浏览器在对“%”执行decodeURIComponent时报错，正确的解决是将%全部替换为%25再进行传输：

const percent2percent25 = (URI) => {
  if(URI.indexOf('%') > -1) {
    return URI.replace(/%/g,'%25')
  }else{
    return URI;
  }
}