字符串encodeURIComponent（编码）/decodeURIComponent（解码）

短命女 2023-10-10 15:56 53阅读 0赞

引入：

> cookie能不能存中文？  
> \* 在tomcat 8 之前 cookie中不能直接存储中文数据。  
> \* 需要将中文数据转码---一般采用URL编码(%E4%B8%E3)（%两位十六进制数）  
> \* 在tomcat 8 之后，cookie支持中文数据。特殊字符还是不支持，建议使用URL编码存储URLEncoder.encode(str\_date,"utf-8");，URL解码解析URLDecoder.decode(time, "utf-8");

**URL（统一资源定位符）**编码方法是属于 Global 全局对象的，encodeURI() 和 encodeURIComponent() 方法可以对**URI(通用资源标示符)**进行编码，以便发送给浏览器，**有效的URI中不能包含某些字符**，例如空格。而这两个URI编码方法就可以对URI进行编码，它们用特殊的UTF-8编码替换所有无效的字符，从而让浏览器能够接受和理解。

其中**encodeURI()** 主要用于整个URI，而 **encodeURICompoent()** 主要用于对URI中的某一段进行编码。它们的主要区别在于，**encodeURI()** 不会对本身属于URI的特殊字符进行编码，例如冒号、正斜杠、问号和井字号；而 **encodeURIComponent** 则会对它发现的任何非标准字符进行编码。

与上述两个方法相对应的两个方法分别是 decodeURI() 和 decodeURIComponent() 。其中，decodeURI() 只能对使用 encodeURI() 替换的字符进行解码。decodeURIComponent() 能够解码使用 encodeURIComponent() 编码的所有字符串。

$(function () {
                /*var search = location.search;
                //alert(search);//?id=5
                var cid = search.split("=")[1];*/
                //获取cid的参数值
                var cid = getParameter("cid");
                //获取输入框rname的参数值
                var rname = getParameter("rname");//得到的是url编码
                //判断rname如果不为null且不等于""
                if (rname) { //有值
                    //url解码
                    rname = window.decodeURIComponent(rname);
                }
    
                alert(cid);
                alert(rname);
                //当页码加载完成后，调用load方法，发送ajax请求加载数据
                load(cid);
    
            });

![c80bab6b2b3573f1828a8162c559b357.png][]

如果前端不需要展示rname，可以不解码，那么只需在后端解码一次

![6c61bb5fe7a3af11d9396a3f6bfb3de0.png][]

后端进行url解码

![4ac030ce1f03d3597cdc20db9c4c45cf.png][]

补充：

[(130条消息) new String(getBytes(ISO-8859-1),UTF-8)中文编码避免乱码\_拉布拉多先生的博客-CSDN博客\_new string 字符集][130_ new String_getBytes_ISO-8859-1_UTF-8_-CSDN_new string]

[c80bab6b2b3573f1828a8162c559b357.png]: https://img-blog.csdnimg.cn/img_convert/c80bab6b2b3573f1828a8162c559b357.png
[6c61bb5fe7a3af11d9396a3f6bfb3de0.png]: https://img-blog.csdnimg.cn/img_convert/6c61bb5fe7a3af11d9396a3f6bfb3de0.png
[4ac030ce1f03d3597cdc20db9c4c45cf.png]: https://img-blog.csdnimg.cn/img_convert/4ac030ce1f03d3597cdc20db9c4c45cf.png
[130_ new String_getBytes_ISO-8859-1_UTF-8_-CSDN_new string]: https://blog.csdn.net/qq_28863045/article/details/79503945