URL--编码解码那些事

1 JS对URL字符串进行编码/解码分析

1.1 为什么要对URL编码和解码?

只有字母和数字[0-9a-zA-Z]、一些特殊符号“$-_.+!*’(),”[不包括双引号]、以及某些保留字，才可以不经过编码直接用于URL。

URL包含汉字
当我们在百度引擎搜索百度百科,网址是这样的


当你复制图一的URL,粘贴(到别的地方)在这里就变成了:https://www.baidu.com/s?ie=UTF-8&wd=%E7%99%BE%E5%BA%A6%E7%99%BE%E7%A7%91

URL中的汉字被转换成了字符

1.2 js对URL编码和解码

js有三个常用的方法,可以对URL编码解码
escape()、unescape()
encodeURI(), decodeURI()
encodeURIComponent() 、decodeURIComponent()

ps:
无论网页的原始编码是什么,一旦被Javascript编码,就都变为unicode字符.也就是说，Javascipt函数的输入和输出，默认都是Unicode字符。

1.2.1 escape()

返回一个可在所有计算机上读取的编码 String 对象。
不会被此方法编码的字符： @ * / +

实际上，escape()不能直接用于URL编码，它的真正作用是返回一个字符的Unicode编码值。比如“春节”的返回结果 是%u6625%u8282，也就是说在Unicode字符集中，“春”是第6625个（十六进制）字符，“节”是第8282个（十六进制）字符。

它的具体规则是，除了ASCII字母、数字、标点符号“@ * _ + - . /”以外，对其他所有字符进行编码。在\u0000到\u00ff之间的符号被转成%xx的形式，其余符号被转成%uxxxx的形式。

escape('努力') // %u52AA%u529B
unescape("%u52AA%u529B") // 努力

1.2.2 encodeURI()

encodeURI('努力') // "%E5%8A%AA%E5%8A%9B"
decodeURI("%E5%8A%AA%E5%8A%9B") // "努力"

1.2.3 encodeURIComponent()

该方法与encodeURI()的区别是,该方法对URL的组成部分进行个别编码,而不用于对整个URL进行编码,
因此，“; / ? : @ & = + $ , #”，这些在encodeURI()中不被编码的符号，在encodeURIComponent()中统统会被编码。至于具体的编码方法，两者是一样。
实际应用中推荐用该方法

encodeURIComponent('努力') // %E5%8A%AA%E5%8A%9B
decodeURIComponent('%E5%8A%AA%E5%8A%9B') // 努力

---

谢谢你阅读到了最后
期待你,点赞、评论、交流