RevealTheme logo

Encoder dan Decoder URL

Konversikan teks ke encoding yang aman untuk URL (percent-encoding) dan sebaliknya. Berguna untuk query string, pengalihan, dan alur OAuth.

Apa itu URL encoding dan kapan Anda membutuhkannya?

URL encoding (juga disebut 'percent-encoding', yang ditentukan dalam RFC 3986) adalah proses mengonversi karakter yang memiliki makna khusus dalam URL —atau karakter yang memang tidak aman dalam URL— menjadi urutan escape heksadesimal '%XX'. Spesifikasi URL mencadangkan karakter tertentu dengan makna struktural: '?' memulai query string, '#' memulai fragmen, '&' memisahkan parameter query, '/' memisahkan segmen path, dan seterusnya. Jika input pengguna mengandung salah satu karakter tersebut dan Anda menyisipkannya apa adanya ke dalam URL, parser akan salah menafsirkannya. URL encoding mencegah hal ini dengan mengganti setiap karakter yang dicadangkan atau tidak aman dengan representasi byte heksadesimalnya yang didahului '%'. Spasi menjadi %20, '&' menjadi %26, '=' menjadi %3D. Karakter non-ASCII (Sirilik, Tionghoa, emoji) dikonversi menjadi urutan UTF-8 multi-byte, dengan setiap byte di-percent-encode. Browser menanganinya secara otomatis saat Anda mengeklik tautan, tetapi setiap kali Anda membangun URL melalui kode —saat membuat query pencarian, tujuan pengalihan, callback OAuth, atau tanda tangan webhook— Anda harus terlebih dahulu meng-encode nilai yang disediakan pengguna. Alat ini menggunakan fungsi encodeURIComponent / decodeURIComponent yang sama dengan yang akan digunakan kode JavaScript Anda, sehingga perilakunya persis sama dengan produksi.

Kasus penggunaan umum

  • Mengodekan istilah pencarian pengguna sebelum menambahkannya ke URL pencarian (?q=user+input).

  • Meneruskan parameter OAuth redirect_uri dengan aman ke server otorisasi.

  • Menyusun URL webhook yang menyertakan payload JSON terenkode di query string.

  • Mengodekan URL 'returnTo' agar tetap utuh saat diteruskan melalui URL lain.

  • Mendekodekan nilai terenkode yang Anda lihat di bilah alamat browser setelah pengiriman formulir.

  • Menguji bagaimana URL yang salah format di-parse — kodekan karakter khusus dan lihat apa yang terjadi.

Pertanyaan yang sering diajukan

Kapan saya harus meng-encode URL?
Selalu encode nilai yang disediakan pengguna sebelum memasukkannya ke dalam URL: parameter query, segmen path, atau fragmen. Tidak meng-encode adalah salah satu sumber bug halus yang paling umum: nilai 'kucing & anjing' merusak query string hingga di-encode menjadi 'kucing%20%26%20anjing'.
Apa perbedaan antara encodeURI dan encodeURIComponent?
encodeURI ditujukan untuk URL lengkap: ia membiarkan karakter struktural seperti '/', '?', '&', '=' tetap utuh karena memiliki makna dalam URL. encodeURIComponent ditujukan untuk bagian URL (nilai query, segmen path): ia meng-encode semua yang bukan alfanumerik. Gunakan encodeURIComponent pada nilai query individual; jangan pernah menggunakan encodeURI pada nilai query yang disediakan pengguna (ia tidak akan meng-escape '&' dan akan merusak query string Anda).
Apa itu Base64 yang aman untuk URL dibandingkan dengan URL encoding?
Keduanya adalah konsep yang berbeda. URL encoding (alat ini) mengganti karakter khusus karakter demi karakter. Base64 yang aman untuk URL adalah varian Base64 yang menggunakan '-' dan '_' alih-alih '+' dan '/', sehingga hasilnya sudah aman untuk URL tanpa encoding tambahan.
Mengapa '+' terkadang di-decode menjadi spasi?
Pada application/x-www-form-urlencoded (pengiriman formulir), '+' adalah singkatan untuk spasi. Sebagian besar decoder mempertahankan ini. Dalam penguraian URI modern, '%20' adalah encoding yang benar untuk spasi. decodeURIComponent memperlakukan '+' sebagai '+' literal; gunakan decodeURI atau decoder formulir untuk mengonversi '+' menjadi spasi.
Bagaimana karakter non-ASCII di-encode?
Pertama-tama karakter tersebut dikonversi menjadi byte UTF-8 dan kemudian setiap byte di-percent-encode. Jadi, 'café' menjadi 'caf%C3%A9': 'é' adalah dua byte UTF-8 (0xC3 0xA9). Alat ini menangani UTF-8 dengan benar; beberapa alat lama meng-encode menggunakan Latin-1, yang menghasilkan output yang berbeda.
Apakah URL encoding sama dengan encoding entitas HTML?
Tidak. URL encoding (%XX) meng-escape karakter untuk URL. Encoding entitas HTML (&, <) meng-escape karakter untuk markup HTML. Konteksnya berbeda; meng-encode salah satu dalam konteks yang lain adalah kesalahan XSS yang umum.

Alat terkait