Apa arti « encode » dan « decode » sebuah URL?
Encode sebuah URL (« url encode », « urlencode ») mengubah setiap karakter yang dilarang dalam alamat — spasi, aksen, ampersand, tanda plus — menjadi sekuens yang terdiri dari tanda persen diikuti dua angka heksadesimal byte-nya. Decode sebuah URL (« url decode », « decoder url ») membaca sekuens tersebut ke belakang: byte dipulihkan lalu diubah menjadi karakter sesuai encoding yang dinyatakan, umumnya UTF-8. Pasangan inilah yang dicari orang ketika mengetik « encoder decoder url » atau « percent encoding online ».
Percent-encoding bukan kompresi maupun enkripsi: kata beraksen menjadi dua kali lebih panjang, dan siapa pun bisa membacanya. Peran satu-satunya adalah membawa byte apa pun ke dalam URL, yang secara default hanya menerima sebagian ASCII. Sebaliknya, Base64 dipakai untuk mengoper byte melalui kanal yang sepenuhnya berbasis teks — keduanya mirip secara visual tetapi tidak bisa saling menggantikan.
Cara mengencode URL ke percent-encoding
Langkah 1: teks diubah menjadi byte sesuai karakter set yang dipilih, UTF-8 secara default. Langkah 2: untuk setiap byte, diperiksa apakah karakter yang bersangkutan termasuk daftar karakter yang diizinkan untuk cakupan terpilih. Langkah 3: jika termasuk, karakter disalin apa adanya; jika tidak, menjadi %XX, dengan XX adalah dua angka heksadesimal byte tersebut. Langkah 4: jika opsi spasi menjadi + aktif, byte 32 diganti dengan tanda plus alih-alih %20.
Contoh nyata: « café & été » pada cakupan komponen menghasilkan caf%C3%A9%20%26%20%C3%A9t%C3%A9. Cukup ketik teks ini di encoder: hasil, ukuran masukan, ukuran keluaran, dan tambahan biaya muncul bahkan sebelum Anda melepas tombol.
Empat cakupan encoding
Cakupan komponen hanya mempertahankan huruf, angka, dan - _ . ! ~ * ' ( ) : itu adalah cakupan untuk nilai parameter, dan sesuai dengan encodeURIComponent. Sedangkan query string juga mempertahankan ampersand dan tanda sama dengan, untuk menyusun ulang query string utuh. segmen path mengizinkan / : @ & = + $ , ; agar slash tidak terpecah. URL lengkap menambahkan lagi ?, #, [ dan ] : hampir tidak ada yang di-escape, hanya spasi dan karakter non-ASCII yang menjadi %XX.
Cara mendecode URL terkode
Dekoding memindai string dari kiri ke kanan: tanda persen diikuti dua angka heksadesimal menghasilkan satu byte, karakter lain disalin apa adanya setelah dikonversi dengan encoding yang dipilih. Byte kemudian dikelompokkan dan diubah menjadi karakter — dua byte untuk « é », tiga untuk « 日 », empat untuk satu emoji. Tab « Decode » menampilkan setiap sekuens yang ditemukan, posisinya dalam string, byte-nya, dan teks yang sesuai.
Jika tanda persen tidak diikuti dua angka yang valid, errornya jelas: sekuens tidak lengkap atau karakter heksadesimal tidak valid. Tombol « Perbaiki % » mengubah tanda persen yang tersendiri menjadi %25, sehingga string bisa didekode tanpa kehilangan informasi — opsi paling aman untuk menangani URL yang sebagian escape.
Spasi: %20 atau + — aturan formulir
%20 adalah spasi percent-encoding yang ketat: berfungsi di path, query, fragment, dan header. Tanda +, justru, hanya menjadi spasi pada format application/x-www-form-urlencoded yang dipakai formulir HTML dan secara historis oleh query string. Di tempat lain ia tetap tanda plus harfiah — dan karena mudah tertukar, ia harus di-escape menjadi %2B segera saat Anda mengencode sebuah nilai.
Dalam praktiknya: untuk mengisi kolom formulir atau meniru perilaku <form>, centang « Spasi menjadi + ». Untuk URL pengalihan, canonical, atau tautan bersama, selalu pilih %20. Decoder, sebaliknya, memperlakukan + sebagai spasi secara default, dan Anda bisa menonaktifkan perilaku ini dengan sekali klik.
RFC 3986: unreserved, sub-delims, dan gen-delims
RFC 3986 membagi karakter ASCII menjadi tiga kategori. Untuk karakter non-reserved — huruf, angka, - _ . ~ — selalu dipertahankan apa adanya. Sedangkan sub-delim ! $ & ' ( ) * + , ; = dan gen-delim : / ? # [ ] @ punya makna struktural: keduanya memisahkan otoritas, path, query, dan fragment. Sisanya — spasi, tanda kutip, kurung siku, kurung kurawal, tanda persen — harus diencode.
Kategori ini persis yang ditampilkan tab « RFC 3986 & referensi » karakter demi karakter: klik sebuah ubin untuk melihat kode heksadesimalnya, kategorinya, dan cakupan yang mempertahankannya. Ini referensi tercepat untuk menjawab pertanyaan « apakah saya harus meng-escape karakter ini ? ».
Karakter beraksen, emoji, dan UTF-8
URL hanya membawa byte ASCII yang aman, sehingga semua karakter di atas U+007F harus diencode. Dalam UTF-8, « é » bernilai C3 A9 dan menjadi %C3%A9, « 日 » bernilai tiga byte dan menghasilkan tiga sekuens, satu emoji memakai empat byte dan menjadi delapan karakter terkode. Jika hasilnya terlihat panjang, itu bukan bug: itu harga dari kompatibilitas dengan semua protokol. Terakhir, perhatikan karakter set aslinya — mendecode string yang dikode Latin-1 dengan UTF-8 menghasilkan karakter aneh, itulah sebabnya empat opsi ditawarkan di tab « Decode ».
Mengapa encodeURIComponent tidak selalu cukup
encodeURIComponent mengencode semua kecuali A-Z a-z 0-9 - _ . ! ~ * ' ( ), yang cocok untuk nilai parameter tetapi merusak URL lengkap karena ikut meng-escape slash, dua titik, dan ampersand. encodeURI melakukan kebalikannya: ia mempertahankan struktur URL tetapi melewatkan spasi dan aksen, sehingga gagal pada teks mentah. Keduanya dicakup di sini — dan lebih lagi, karena cakupan « Query string » dan cakupan « Segmen path » menutup jarak di antara keduanya.
Percent-encoding dan Base64: dua alat berbeda
Percent-encoding mengganti byte per byte dan menjaga teks asli tetap terbaca, dengan harga string yang jauh lebih panjang. Base64 mengelompokkan byte per tiga dan menulisnya ulang dalam alfabet 64 karakter: ringkas tetapi sama sekali tidak terbaca, dan tak bisa dipakai langsung di URL tanpa varian URL-safe. Tab « Encoding silang » menampilkan keduanya dalam sekali pandang, ditambah byte heksadesimal, entitas HTML, dan string JSON yang di-escape — sehingga Anda bisa memilih representasi yang tepat sebelum menyalin apa pun.
Kesalahan umum: encoding ganda dan % tersendiri
Kesalahan paling umum adalah meng-escape string yang sama dua kali: sebuah spasi menjadi %20, lalu %2520, dan server menerima persis « %20 ». Yang kedua adalah lupa tanda persen itu sendiri, yang seharusnya menjadi %25 — kalau tidak decoder menganggapnya sebagai awal sekuens lalu error atau memotong. Terakhir, menyimpan + yang tidak di-escape dalam parameter formulir sama saja dengan menyisipkan spasi yang tidak Anda minta. Decoder menandai sekuens yang salah format, dan tombol « Perbaiki % » memperbaiki kasus kedua tanpa kehilangan data.
Di mana URL terkode bersembunyi
Dalam query string pelacakan UTM, dalam redirect_uri dan parameter state OAuth, dalam webhooks yang URL targetnya memuat parameter bersarang, dalam URL callback yang ditandatangani, dalam log server, dalam sitemap dan canonical, dalam <a href> yang dibuat di sisi klien, dalam JWT yang payload-nya Base64URL, dalam data: dan header Location, serta setiap formulir HTML yang dikirim via GET. Mengetahui cara mengencode dan decode dalam sekejap membuat Anda tak perlu membuka terminal hanya untuk satu string.
Performa dan praktik terbaik
Di browser, encoding dan dekoding berjalan linear dan nyaris tidak berbiaya, bahkan untuk beberapa megabyte: setiap karakter diproses sekali, tanpa rekursi maupun alokasi per karakter. Satu-satunya jebakan adalah encoding ganda — selalu periksa round-trip sebelum menyimpan — dan URL berukuran beberapa kilobyte, yang sering dipotong proxy di atas 2 000 karakter. Dokumentasikan cakupan yang dipakai di samping string yang dihasilkan: « komponen » dan « URL lengkap » tidak memberikan hasil yang sama pada teks yang sama.
Direkomendasikan untuk
Pengembang back-end dan front-end (query string, pengalihan, OAuth), integrator dan penulis teknis (tautan UTM, canonical, tracking), administrator dan DevOps (webhook, URL bertanda tangan, log), tester dan pentester (fuzzing parameter, bypass filter), mahasiswa (memahami UTF-8, ASCII, dan RFC 3986), serta siapa pun yang membutuhkan encoder decoder URL online cepat, lengkap, dan privat — dengan pelengkap encoder decoder Base64 dan pemformat JSON.