正確編碼查詢字串參數
本工具有兩種模式。「組件」(encodeURIComponent)用於單一參數名稱或參數值;「完整 URL」(encodeURI)用於結構已正確的完整 URL。混用兩者是查詢字串出錯最常見的原因。
計算範例
「完整 URL」模式保留了值裡的 &,伺服器因此讀到兩個參數而不是一個。
- 輸入
- https://example.com/search?q=salt & pepper&page=2
- 結果 ·
encodeURI() - https://example.com/search?q=salt%20&%20pepper&page=2
伺服器讀到的參數
- "q" = "salt "
- " pepper" = ""
- "page" = "2"
先用「組件」模式編碼這個值,它就會維持為一個參數。
- 輸入
- salt & pepper
- 結果 ·
encodeURIComponent() - salt%20%26%20pepper
https://example.com/search?q=salt%20%26%20pepper&page=2
伺服器讀到的參數
- "q" = "salt & pepper"
- "page" = "2"
「組件」與「完整 URL」模式逐字元比較
| 字元 | 組件 | 完整 URL |
|---|---|---|
| : | %3A | : |
| / | %2F | / |
| ? | %3F | ? |
| # | %23 | # |
| & | %26 | & |
| = | %3D | = |
| + | %2B | + |
| ␠ | %20 | %20 |
| é | %C3%A9 | %C3%A9 |
工具的處理方式
- 用「組件」模式分別編碼每個參數名稱和參數值,它會跳脫 & = ? # + 和 /。
- 把編碼後的鍵值對以 名稱=值 的形式用 & 連接,再放在 URL 的 ? 之後。
- 「完整 URL」模式只用於整個 URL:它會保留 : / ? # & = + 不變,因此無法保護含有這些字元的值。