關(guān)于URL編碼

HitenDev 發(fā)布于2019-08-20 18:21 / 3393人閱讀

摘要：基本概念編碼不能直接使用需要編碼領(lǐng)杉果紅包，享更多優(yōu)惠點(diǎn)擊領(lǐng)取問(wèn)題的由來(lái)就是網(wǎng)址只要上網(wǎng)就一定會(huì)用到只有字母和數(shù)字一些特殊符號(hào)以及某些保留字才可以不經(jīng)過(guò)編碼直接用于這意味著如果中有漢字就必須編碼后使用但是麻煩的是沒(méi)有規(guī)定具體的編碼方

基本概念

1.encodeComponent編碼url,url不能直接使用,需要編碼

var rlt = "http://service.weibo.com/share/share.php?";
var url = "http://www.baidu.com";
var params = {
    appkey: "379570494",
    title: "領(lǐng)杉果紅包，享更多優(yōu)惠！點(diǎn)擊領(lǐng)取：",
    url: url
};
for (var i in params) {
    rlt += i + "=" + params[i] + "&";
}
for (var i in params) {
    rlt += i + "=" + encodeURIComponent(params[i]) + "&";
}
console.log(rlt);

問(wèn)題的由來(lái)

1.URL就是網(wǎng)址,只要上網(wǎng),就一定會(huì)用到.
只有字母和數(shù)字[0-9a-zA-Z],一些特殊符號(hào)$-_.+!*"(),以及某些保留字,才可以不經(jīng)過(guò)編碼直接用于URL.
2.這意味著,如果URL中有漢字,就必須編碼后使用,但是麻煩的是,RFC1738沒(méi)有規(guī)定具體的編碼方法,
而是交給應(yīng)用程序(瀏覽器)自己決定,這導(dǎo)致"URL編碼"成為了一個(gè)混亂的領(lǐng)域.
3.包括:ajax請(qǐng)求url地址,瀏覽器上直接用get或post發(fā)出http請(qǐng)求,網(wǎng)址路徑中包含漢字,查詢字符串包含漢字.
4.使用js先對(duì)URL編碼,然后再向服務(wù)器提交,不給瀏覽器插手的機(jī)會(huì),
因?yàn)閖s的輸出總是一致的,所以就保證了服務(wù)器得到的數(shù)據(jù)是格式統(tǒng)一的.

escape,unescape

escape()不能直接用于URL編碼,他的真正作用是返回一個(gè)字符串的Unicode編碼值.

encodeURI和decodeURI

1.encodeURI()是js中真正用來(lái)對(duì)URL編碼的函數(shù)
2.它著眼于對(duì)整個(gè)URL進(jìn)行編碼,因此除了常見(jiàn)的符號(hào)以外,對(duì)其他一些在網(wǎng)址中有特殊含義的符號(hào);/?:@&=+$,#也不進(jìn)行編碼,
編碼后,它輸出符號(hào)的utf-8形式,并且在每個(gè)字節(jié)前加上%

encodeURIComponent和decodeURIComponent

與encodeURI()的區(qū)別是,它用于對(duì)URL的組成部分進(jìn)行個(gè)別編碼,而不用于對(duì)整個(gè)URL進(jìn)行編碼.
因此,;/?:@&=+$,#這些在encodeURI()中不被編碼的符號(hào),在encodeURIComponent中統(tǒng)統(tǒng)會(huì)被編碼.

var test = "http://www.baidu.com/my app?search=a&b=3#2哈哈";
var test1 = encodeURIComponent(test);
var test2 = encodeURI(test);
console.log(test);  // http://www.baidu.com
console.log(test1); // http%3A%2F%2Fwww.baidu.com%2Fmy%20app%3Fsearch%3Da%26b%3D3%232%E5%93%88%E5%93%88,瀏覽器無(wú)法解析這個(gè)地址
console.log(test2); // http://www.baidu.com/my%20app?search=a&b=3#2%E5%93%88%E5%93%88,瀏覽器無(wú)法解析這個(gè)地址

var test3 = decodeURIComponent(test1);
var test4 = decodeURI(test2);
console.log(test3);
console.log(test4);

var test5 = escape(test);
var test6 = unescape(test5);
console.log(test5); // http%3A//www.baidu.com/my%20app%3Fsearch%3Da%26b%3D3%232%u54C8%u54C8
console.log(test6); // http://www.baidu.com/my app?search=a&b=3#2哈哈