开发常见需求之js处理url汉字编码中的乱码

Posted 2020-08-09

需求及解决

  

　　两个页面传值的需求是很常见的，angular中有很多常见的方法用于传值，而且都不会受到字符编码的影响，而采用传统的url中拼字符串进行传值的操作，如果拼串中涉及到中文字符，我们就要考虑页面的编码问题了。

  如如下的地址

http://www.xxx.com/ddd?type=10&gn=你好

经过url编码转变为

http://www.xxx.com/ddd?type=10&gn=%E5%81

从而导致如果直接获取这个值会出现异常显示

 

通常我们要解决两个问题：

 

• 将search部分可能存在编码的字符串从地址中提取出来，如需要处理编码的其实就只是gn这个参数
• 判断该字符串是否进行了编码，并对其进行操作

 

网上有很多方法，使用起来效率不高而且还报错，我这里总结了一个可用的，代码如下：

 

//传入可能出现编码的key值，返回相应的value
function GetQueryString(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
    var r = window.location.search.substr(1).match(reg);
    if(r != null) return(r[2]);
        return null;
}

//测试用的数据
var gn = GetQueryString("gn");

//判断gn是否编码，如果编码了就进行解码
if(!(gn.indexOf( "%" )<0)) {
    gn = decodeURI(gn);
}

 

核心原理是使用正则匹配，然后判断字符串是否以%开头，所以这种方法只适用于url编码的问题，其他编码大家自行修改就成。