Meng-encode parameter query string dengan benar
Alat ini punya dua mode. Komponen (encodeURIComponent) untuk satu nama atau nilai parameter; URL lengkap (encodeURI) untuk URL utuh yang strukturnya sudah benar. Tertukar di antara keduanya adalah penyebab paling umum query string rusak.
Contoh langkah demi langkah
Mode URL lengkap membiarkan & di dalam nilai, sehingga server membaca dua parameter, bukan satu.
- Masukan
- https://example.com/search?q=salt & pepper&page=2
- Hasil ·
encodeURI() - https://example.com/search?q=salt%20&%20pepper&page=2
Parameter yang dibaca server
- "q" = "salt "
- " pepper" = ""
- "page" = "2"
Meng-encode nilai terlebih dahulu dalam mode Komponen membuatnya tetap satu parameter.
- Masukan
- salt & pepper
- Hasil ·
encodeURIComponent() - salt%20%26%20pepper
https://example.com/search?q=salt%20%26%20pepper&page=2
Parameter yang dibaca server
- "q" = "salt & pepper"
- "page" = "2"
Perbandingan mode Komponen dan URL lengkap per karakter
| Karakter | Komponen | URL lengkap |
|---|---|---|
| : | %3A | : |
| / | %2F | / |
| ? | %3F | ? |
| # | %23 | # |
| & | %26 | & |
| = | %3D | = |
| + | %2B | + |
| ␠ | %20 | %20 |
| é | %C3%A9 | %C3%A9 |
Cara alat ini menanganinya
- Encode setiap nama dan nilai parameter secara terpisah dalam mode Komponen, yang meng-escape & = ? # + dan /.
- Gabungkan pasangan yang sudah di-encode sebagai nama=nilai dengan & di antaranya, lalu tambahkan hasilnya setelah ? pada URL.
- Gunakan mode URL lengkap hanya untuk URL utuh: mode ini membiarkan : / ? # & = + apa adanya sehingga tidak dapat melindungi nilai yang memuat karakter tersebut.