認識 URL 編碼與百分比編碼
這個工具的功能
一個 URL 只能安全承載有限的字元。凡是落在未保留字母、數字和少數符號之外的字元,都必須改寫成百分比編碼:一個 % 符號後面接著該位元組的十六進位值。這個工具會把一般文字轉換成該編碼形式,也能反向運作,把 %20、%26 這類序列還原成它們所代表的字元。
三種編碼模式涵蓋了實際會遇到的情況。標準編碼對應 JavaScript 的 encodeURI,針對的是整個 URL,因此像 :、/、?、# 這類結構字元會保持原樣。元件編碼對應 encodeURIComponent,連這些結構字元也一併跳脫,適合用在參數值這種單獨的片段。表單編碼則遵循瀏覽器送出表單時使用的 application/x-www-form-urlencoded 規則。
何時使用
只要有值要放進查詢字串裡,就選用元件編碼:例如搜尋關鍵字、電子郵件地址,或本身就含有 ?、&、= 的轉址目標。先編碼可以避免這些符號被當成 URL 結構解讀而使連結失效。標準編碼適合用來整理一個完整的網址,裡頭混進了空格或帶重音的字母,但斜線和問號仍必須保有意義。表單編碼對應 POST 請求的主體或手動組出的表單內容,此時空格會寫成 + 而非 %20。解碼同樣常用:把從記錄檔、分析報表或轉址鏈裡取得的已編碼連結貼上,讀出它實際指向何處。
具體範例
以 hello world & café 這段文字為例。在元件編碼下,空格會變成 %20,& 符號會變成 %26,而 café 因為 é 以兩個 UTF-8 位元組儲存,會變成 caf%C3%A9。在表單編碼下,同樣的空格會寫成 +,於是得到 hello+world。即時統計會顯示有多少字元改變、字串中有多少比例被編碼,是快速辨認出已經編碼過一次的文字的方法。
注意事項與邊界情況
保留字元(: / ? # [ ] @ ! $ & ' ( ) * + , ; =)在 URL 內具有意義,因此標準模式會刻意保留它們,而元件模式則會將它們跳脫;選錯模式正是查詢參數失效的常見原因。編碼是以 UTF-8 位元組為基準定義的,所以任何非 ASCII 字元都會展開成好幾組 %XX。切勿把同一個 URL 編碼兩次:一個原本已屬於跳脫序列的 % 若單獨變成 %25,連結就無法再解析。拿不準時,先解碼確認文字是原始狀態還是已經跳脫過。