url编码 及 js中url编码的api和应用
在因特网上传送URL,只能采用ASCII字符集
,即是常说的get请求只能使用ASCII 字符
也就是说URL只能使用字母和数字[0-9a-zA-Z]、一些特殊符号$-_.+!*’()[不包括双引号]、以及某些保留字(空格转换为+),才可以不经过编码直接用于URL
RFC文档的建议:
这意味着 如果URL中有汉字或者不在ASCII字符集中的特殊符号
,就必须编码后才能使用。
对于非ASCII字符,RFC文档建议
使用utf-8
对其进行编码得到相应的字节,然后对每个字节执行百分号编码
可以看到a!@$%%5E&*() 都可以在ASCII对照表中查得到,而¥符号
在ASCII对照表中是没有的,那么就会进行转换,首先会在UTF-8字符集中找到¥符号的16进制编码,经过Url编码之后得到%EF%BF%A5
。
url编码混乱的原因:
麻烦的是,建议始终都是建议,没有统一的一套标准,难免有些人会不听取建议。
标准的国际组织并没有规定具体的编码方法,而是交给应用程序(浏览器)自己决定。 这导致"URL编码"成为了一个混乱的领域
。不同的浏览器对于非ASCII字符可能采用不同的转换方式,有的听取建议按照utf-8
处理url上非ASCII字符,有的则使用GB2312
编码。
如何做到统一:
不同的浏览器将导致完全不同的编码结果。如果程序员要把每一种结果都考虑进去,是不是太恐怖了?有没有办法,能够保证客户端只用一种编码方法向服务器发出请求?
回答是有的,就是使用Javascript先对URL编码
,然后再向服务器提交,不要给浏览器插手的机会
。因为Javascript的输出总是一致的,所以就保证了服务器得到的数据是格式统一的。
实现统一的方式:
Javascript中提供了3对函数用来对Url编码以得到合法的Url,
它们分别是:
escape / unescape
encodeURI / decodeURI
encodeURIComponent / decodeURIComponent
由于解码和编码的过程是可逆的,因此这里只解释编码的过程。
这三个编码的函数——escape,encodeURI,encodeURIComponent——都是用于将不安全不合法的Url字符转换为合法的Url字符表示,它们有以下几个不同点。
- 安全字符不同:
下面列出了这三个函数的安全字符(即函数不会对这些字符进行编码)
escape(69个): */@+-._0-9a-zA-Z
encodeURI(82个): !#$&'()*+,/:;=?@-._~0-9a-zA-Z
encodeURIComponent(71个): !'()*-._~0-9a-zA-Z
- 对Unicode字符的编码方式不同:
这三个函数对于ASCII字符的编码方式相同,均是使用百分号+两位十六进制字符来表示。但是对于Unicode字符,escape的编码方式是%uxxxx,其中的xxxx是用来表示unicode字符的4位十六进制字符。这种方式已经被W3C废弃了
。但是在ECMA-262标准中仍然保留着escape的这种编码语法。encodeURI和encodeURIComponent则使用UTF-8对非ASCII字符进行编码,然后再进行百分号编码。这是RFC推荐的
。因此建议尽可能的使用这两个函数替代escape进行编码。
- 适用场合不同:
encodeURI被用作对一个完整的URI进行编码,而encodeURIComponent被用作对URI的一个组件进行编码
。从上面提到的安全字符范围表格来看,我们会发现,encodeURIComponent编码的字符范围要比encodeURI的大
encodeURI():
- encodeURI()是Javascript中
真正用来对URL编码的函数
。
它着眼于对整个URL进行编码
,因此除了常见的符号以外,对其他一些在网址中有特殊含义的符号"; / ? : @ & = + $ , #",也不进行编码。编码后,它输出符号的utf-8形式,并且在每个字节前加上%。
encodeURIComponent()
-
它用于对URL的组成部分进行个别编码
,而不用于对整个URL进行编码。
因此,"; / ? : @ & = + $ , #",这些在encodeURI()中不被编码的符号,在encodeURIComponent()中统统会被编码。至于具体的编码方法,两者是一样。
encodeURIComponent() 和 encodeURI() 的区别演示:
console.log(encodeURI("?name=zhangsan&age=21"))
console.log(encodeURIComponent("?name=zhangsan&age=21"))
总结:
开发中大部分情况下使用encodeURI / decodeURI
完全可以了
本文地址:https://blog.csdn.net/fesfsefgs/article/details/107888978
上一篇: at命令的详细用法
下一篇: scss混合(mixins)使用