JS對url進行編碼和解碼(三種方式區別)


Javascript語言用於編碼的函數,一共有三個,最古老的一個就是escape()。雖然這個函數現在已經不提倡使用了,但是由於歷史原因,很多地方還在使用它,所以有必要先從它講起。

escape 和 unescape

實際上,escape()不能直接用於URL編碼,它的真正作用是返回一個字符的Unicode編碼值。比如"春節"的返回結果是%u6625%u8282,也就是說在Unicode字符集中,"春"是第6625個(十六進制)字符,"節"是第8282個(十六進制)字符。

它的具體規則是,除了ASCII字母、數字、標點符號"@ * _ + - . /"以外,對其他所有字符進行編碼。在u0000u00ff之間的符號被轉成%xx的形式,其余符號被轉成%uxxxx的形式。對應的解碼函數是unescape()

還有兩個地方需要注意。

  • 首先,無論網頁的原始編碼是什么,一旦被Javascript編碼,就都變為unicode字符。也就是說,Javascipt函數的輸入和輸出,默認都是Unicode字符。這一點對下面兩個函數也適用。

  • 其次,escape()不對"+"編碼。但是我們知道,網頁在提交表單的時候,如果有空格,則會被轉化為+字符。服務器處理數據的時候,會把+號處理成空格。所以,使用的時候要小心。

例如:
編碼:

escape('http://www.baidu.com?name=zhang@xiao@jie&order=1')
結果:"http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1"

escape('張')
結果:"%u5F20"

解碼:

unescape("http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1")
結果:"http://www.baidu.com?name=zhang@xiao@jie&order=1"

unescape("%u5F20")
結果:"張"

encodeURI 和 decodeURI

有效的URI(通用資源標識符)不能包含某些字符,例如空格,那么就需要使用encodeURI()encodeURIComponent()對URI進行編碼。

encodeURI()是Javascript中真正用來對URL編碼的函數。encodeURI()不會對本身URI的特殊字符進行編碼,例如冒號、正斜杠、問號和井字號。而encodeURIComponent()則會對它發現的任何非標准字符進行編碼。如下例子:

var uri = 'https://www.baidu.com/a/ value.htm#end'
console.log(encodeURI(uri))  //https://www.baidu.com/a/%20value.htm#end
console.log(encodeURIComponent(uri)) //https%3A%2F%2Fwww.baidu.com%2Fa%2F%20value.htm%23end

encodeURI()把uri中的空格給編譯了,其它的都沒有變化,而encodeURIComponent()把它發現的任何非標准字符都進行了編碼。

總結:encodeURI()它着眼於對整個URL進行編碼,因此除了常見的符號以外,對其他一些在網址中有特殊含義的符號"; / ? : @ & = + $ , #",不進行編碼。編碼后,它輸出符號的utf-8形式,並且在每個字節前加上%。
它對應的解碼函數是decodeURI()

注:需要注意的是,它不對單引號'編碼。

例如:
編碼:

encodeURI('http://www.baidu.com?name=zhang@xiao@jie&order=1')
結果:"http://www.baidu.com?name=zhang@xiao@jie&order=1"

解碼:

decodeURI("http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1")
結果:"http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1"

encodeURIComponent 和 decodeURIComponent

最后一個Javascript編碼函數是encodeURIComponent()。與encodeURI()的區別是,它用於對URL的組成部分進行個別編碼,而不用於對整個URL進行編碼。

因此,"; / ? : @ & = + $ , #",這些在encodeURI()中不被編碼的符號,在encodeURIComponent()中統統會被編碼。至於具體的編碼方法,兩者是一樣。
它對應的解碼函數是decodeURIComponent()

例如:
編碼:

encodeURIComponent('http://www.baidu.com?name=zhang@xiao@jie&order=1')
結果:"http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhang%40xiao%40jie%26order%3D1"

解碼:

decodeURIComponent("http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhang%40xiao%40jie%26order%3D1")
"http://www.baidu.com?name=zhang@xiao@jie&order=1"

參考地址:阮一峰:關於URL編碼


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM