encodeURI、encodeURIComponent、btoa及其应用场景
2016-01-05 14:36
501 查看
escape不编码字符有69个:*,+,-,.,/,@,_,0-9,a-z,A-Z
encodeURI不编码字符有82个:!,#,$,&,’,(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z
encodeURIComponent不编码字符有71个:!, ‘,(,),*,-,.,_,~,0-9,a-z,A-Z
1.encodeURI
encodeURI是用来编码URI的,最常见的就是编码一个URL。
encodeURI方法不会编码下列字符:":", "/", ";", and "?",不过我们可以通过下面的encodeURIComponent方法来编码这些字符。
例如URL中包含中文:
由于
服务器收到的
2.encodeURIComponent
encodeURIComponent是用来编码URI参数的。decodeURIComponent方法可以恢复到原有字符串。
它只会跳过非转义字符(字母数字以及
由于encodeURIComponent能够编码差不多所有字符,当我们把编码过的/folder1/folder2/default.html发送到服务器时时,由于‘/’也将被编码,服务器将无法正确识别。
比如上面的例子:
因为
3.btoa
btoa:将ascii字符串或二进制数据转换成一个base64编码过的字符串,该方法不能直接作用于Unicode字符串。
atob:将已经被base64编码过的数据进行解码。
注意:因为btoa仅将ascii字符串或二进制数据进行编码,不能作用于unicode字符串,所以对中文的base64编码会报错:
如果要对中文进行base64编码,只需要将中文进行 encodeURIComponent 进行编码之后再进行 base64编码即可。
完整的utf8编码字符串进行base64编码示例:
encodeURI不编码字符有82个:!,#,$,&,’,(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z
encodeURIComponent不编码字符有71个:!, ‘,(,),*,-,.,_,~,0-9,a-z,A-Z
1.encodeURI
encodeURI是用来编码URI的,最常见的就是编码一个URL。
encodeURI会将需要编码的字符转换为UTF-8的格式。decodeURI方法可以恢复到原有字符串。
encodeURI方法不会编码下列字符:":", "/", ";", and "?",不过我们可以通过下面的encodeURIComponent方法来编码这些字符。
例如URL中包含中文:
encodeURI('http://www.我.com') // => "http://www.%E6%88%91.com"
由于
encodeURI不转义
&,
+, 和
=。所以URL参数的值是无法转义的,比如我们想把
a=?传给服务器:
encodeURI('http://www.我.com?a=?') // => "http://www.%E6%88%91.com?a=?"
服务器收到的
a值为空,因为
?是URL保留字符。此时我们需要用
encodeURIComponent来编码!
2.encodeURIComponent
encodeURIComponent是用来编码URI参数的。decodeURIComponent方法可以恢复到原有字符串。
它只会跳过非转义字符(字母数字以及
-_.!~*'()), URL保留字符(
;,/?:@&=+$#)均会被转义。
由于encodeURIComponent能够编码差不多所有字符,当我们把编码过的/folder1/folder2/default.html发送到服务器时时,由于‘/’也将被编码,服务器将无法正确识别。
比如上面的例子:
// => "http://www.我.com?a=%3F" encodeURI('http://www.我.com') + '?a=' + encodeURIComponent('?');
因为
encodeURIComponent会编码所有的URL保留字,所以不适合编码URL,例如:
encodeURIComponent('http://www.我.com') "http%3A%2F%2Fwww.%E6%88%91.com"
3.btoa
btoa:将ascii字符串或二进制数据转换成一个base64编码过的字符串,该方法不能直接作用于Unicode字符串。
atob:将已经被base64编码过的数据进行解码。
注意:因为btoa仅将ascii字符串或二进制数据进行编码,不能作用于unicode字符串,所以对中文的base64编码会报错:
btoa("hello 童童"); // InvalidCharacterError: 'btoa' failed: The string to be encoded contains characters outside of the Latin1 range.
如果要对中文进行base64编码,只需要将中文进行 encodeURIComponent 进行编码之后再进行 base64编码即可。
btoa(encodeURIComponent("hello 童童")); // "aGVsbG8lMjAlNDAlRTQlQkElOTElRTYlQjclQTElRTclODQlQjY="
完整的utf8编码字符串进行base64编码示例:
// 完整的utf8字符串base64编码与解码 function uft8ToBase64(utf8) { return btoa(encodeURIComponent(utf8)); } function base64ToUtf8(base64) { return decodeURIComponent(atob(base64)); } var base64 = uft8ToBase64("hello 童童"); // "aGVsbG8lMjAlNDAlRTQlQkElOTElRTYlQjclQTElRTclODQlQjY=" base64ToUtf8(base64); // "hello 童童"
相关文章推荐
- 易货Beta版本发布说明
- clang: error: linker command failed with exit code 1 (use -v to see invocation)
- (原)前端知识杂烩(css系列)
- 解决adb push ODEX 后缀文件不生效的问题
- SOAP1.1和1.2 深入解析WSDL
- 《失控》:最干货编录与总结
- Command /Applications/Xcode.app/Contents/Developer/Toolchains/XcodeDefault.xctoolchain/usr/bin/lex f
- Android开发—使用已有的sql数据库
- 团队成员梁飞专访:阿里巴巴分布式服务框架Dubbo
- 浅析HTML5 Web Workers使用场景与作用
- Java for Web学习笔记(十二):JSP(2)Tag:directive,declaration,scriptlet,expression
- D3.js--动态树
- python知识-错误和异常
- 使用block遍历数组成员的方法
- 申请二维空间 并释放
- Opencv中的MESR特征
- LayoutInflater的应用
- Ubuntu修改ip地址
- ES6学习——新的语法:Symbol API介绍
- 1.3.6 简化变参方法调用