encodeURI、encodeURIComponent、btoa及其应用场景
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
会将需要编码的字符转换为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 童童"
encodeURI、encodeURIComponent、btoa及其应用场景的更多相关文章
- url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介
url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介 2014年10月12日 16806次浏览 引子 浏览器URl地址,上网一定会用到,但是浏 ...
- escape,encodeURI,encodeURIComponent函数比较
escape,encodeURI,encodeURIComponent函数比较 js对文字进行编码涉及3个函数:escape,encodeURI,encodeURIComponent,相应3个解码函数 ...
- escape,encodeURI,encodeURIComponent
JavaScript/js中,有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,d ...
- Flex中escape/encodeURI/encodeURIComponent的区别
Flex中提供了三种转码函数,各有各的区别, escape,encodeURI,encodeURIComponent 这三个函数不仅在flex中有道运用在javascript中同样的含义 ,今天我仔细 ...
- URI 方法 encodeURI() encodeURIComponent() docodeURI() decodeURIComponent()
URI 方法 encodeURI() encodeURIComponent() docodeURI() decodeURIComponent() var sUri = “http://ww ...
- url的三个js编码函数escape(),encodeURI(),encodeURIComponent()简介【转】
引子 浏览器URl地址,上网一定会用到,但是浏览器地址有中文或者浏览器url参数操作的时候,经常会用到encodeURIComponent()和decodeURIComponent()以及encode ...
- encodeURI & encodeURIComponent
[encodeURI & encodeURIComponent] 区别在于,"&", "+", 和 "=" 不会被enco ...
- JavaScript中有三个可以对字符串编码的函数,分别是: escape(),encodeURI(),encodeURIComponent()
JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod ...
- JavaScript中有对字符串编码的三个函数:escape,encodeURI,encodeURIComponent
JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod ...
随机推荐
- (连通图 缩点 强联通分支)Popular Cows -- poj --2186
http://poj.org/problem?id=2186 Description Every cow's dream is to become the most popular cow in th ...
- [label][JavaScript扩展] JavaSCript扩展
http://www.idangero.us/sliders/swiper/ ,swipper for mobile terminal.
- .NET 匿名方法的BUG,请专家解答
匿名方法是.NET 3.5之后的一个好东东,很多人使用,但是我在最近的工作当中发现了一个问题. 请专家解答 //list里存放10个数字 List<); ; i < ; i++) { li ...
- django drf 改变retrive的pk查询字段
lookup_filed可以改变retrive查询时默认以pk查询的逻辑 from django.shortcuts import render from rest_framework import ...
- netcore中使用bower还原出错的解决方法
近期BitAdminCore框架在创建时,还原bower包出现502错 打开地址,发现原为是因为bower服务调整导致的. 果断处理: 1.通过管理员模式,启动命令行 2.进入npm所在目录 3.执行 ...
- IIS隐藏网站
IIS隐藏网站 1.站点建立一个文件夹:Test 2.在F盘新建Web文件夹(放要隐藏的网站) 3.右键Test文件夹-新建虚拟目录,虚拟目录指向步骤2 4.删除Test文件夹即可
- JS获取节点属性个数及值得方法
var ex = node; ; for (var j in ex) { alert("" + myIndex + ".(<font color='blue'> ...
- WordPress插件Social Warfare<=3.5.2 无需登录RCE漏洞
该漏洞只存在于Social Warfare插进的3.5.0.3.5.1和3.5.2版本中,其他版本不存在. 2019年3月21日插件作者紧急发布了3.5.3版本以修复高危的RCE漏洞,在<=3. ...
- ceph pg_num 数值计算
通常在创建pool之前,需要覆盖默认的pg_num,官方推荐: 若少于5个OSD, 设置pg_num为128. 5~10个OSD,设置pg_num为512. 10~50个OSD,设置pg_num为40 ...
- Exp5 MSF基础应用 20164323段钊阳
网络对抗技术 20164323 Exp5 MSF基础应用 靶机 ip:192.168.1.229 kali ip:192.168.1.216 exploit选取 主动攻击:ms17_010_psexe ...