Pilla 技術宅

escape()

採用ISO Latin字符集對指定的字符串進行編碼。所有的空格符、標點符號、特殊字符以及其他非ASCII字符都將被轉化成%xx格式的字符編碼（xx等於該字符在字符集表裡面的編碼的16進制數字）。比如，空格符對應的編碼是%20。 不會被此方法編碼的字符： @ * / +

encodeURI()

把URI字符串採用UTF-8編碼格式轉化成escape格式的字符串。 不會被此方法編碼的字符：! @ # $& * ( ) = : / ; ? + '

encodeURIComponent()

把URI字符串採用UTF-8編碼格式轉化成 escape格式的字符串。與encodeURI()相比，這個方法將對更多的字符進行編碼，比如 / 等字符。所以如果字符串裡面包含了URI的幾個部分的話，不能用這個方法來進行編碼，否則 / 字符被編碼之後URL將顯示錯誤。 不會被此方法編碼的字符：! * ( ) '

結論

* 只要是使用者會輸入的欄位，一律使用encodeURIComponent來避免不可預期的困擾

$.serialize()

若是使用JQuery Ajax的.serialize()，該函式會自動做好encoded的動作

The .serialize() method creates a text string in standard URL-encoded notation.

HTML:

<form id="testForm">
  <input id="testURL" name="testURL" value="http://www.smashingmagazine.com/2008/10/13/pricing-tables-showcase-examples-and-best-practices/" />
  <input id="normalText" name="normalText" value="中文字" />
</form>

Javascript:

var text = $('#testForm').serialize();

Result:

testURL=http%3A%2F%2Fwww.smashingmagazine.com%2F2008%2F10%2F13%2Fpricing-tables-showcase-examples-and-best-practices%2F&normalText=%E4%B8%AD%E6%96%87%E5%AD%97

$.param()

使用.param()這函式也會自動轉換

Javascript:

$.param({a:"1=2", b:"Test 1", c:"中文字"})

Result:

a=1%3D2&b=Test+1&c=%E4%B8%AD%E6%96%87%E5%AD%97

$.ajax()

使用ajax的url 在送出去後會自動被轉換

$.ajax({
    url: '/songs?plName=' + '中文',
    method: 'GET',
    timeout: 10000
})  

Result:

http://192.168.101.192:3000/songs?plName=%E4%B8%AD%E6%96%87

但是放在data的如果沒呼叫encodeURIComponent則不會進行動作，下面麗子plName就不會轉碼

$.ajax({
    url: '/playlist',
    method: 'PUT',
    data: {
        plName: plName
    },  
    timeout: 10000
})  

JSON.stringify()

這個函式不會對字元轉碼，只會轉成Json格式而已