Enkoder dan Dekoder Entitas HTML
Enkode teks ke entitas HTML yang aman atau dekode kembali, secara instan — alat gratis untuk developer.
Teks Anda tetap di perangkat
Tidak ada yang perlu dihapus kemudian
Aman untuk data pengguna sungguhan
Jalan di semua browser modern
Cara kerjanya
- 1
Tempel teks Anda
Teks bertanda kurung sudut, ampersand, tanda kutip, atau huruf beraksen yang harus duduk di dalam markup.
- 2
Pilih konteksnya
Badan teks, nilai atribut, atau pengodean penuh — masing-masing meloloskan himpunan karakter yang berbeda.
- 3
Salin hasilnya
Tempelkan ke sebuah templat, dokumen XML, umpan, atau badan surel.
Mengapa memakai alat ini
Konteks itu pilihan, bukan terkaan
Meloloskan untuk badan teks, untuk nilai atribut, dan untuk URL adalah tiga pekerjaan berbeda, dan Anda yang memilih.
Pengodean ganda tertangkap
Masukan yang sudah berisi entitas ditandai, jadi Anda tak mengubah sebuah ampersand menjadi entitas dua kali.
Keluaran bernama atau numerik
Rujukan numerik bekerja di XML, umpan, dan SVG, tempat hampir semua entitas bernama justru tak terdefinisi.
Pemecahan aman pulang pergi
Bentuk bernama dan numerik sama-sama dikenali, termasuk ejaan heksadesimal dan entitas tanpa titik koma.
Jujur soal apa yang dikerjakan pelolosan
Ia membuat teks aman ditaruh di sebuah konteks — klaim yang lebih kecil daripada membuat markup tak tepercaya jadi aman.
Tak ada yang meninggalkan browser
Teksnya diubah di halaman ini, jadi isi tiket dan nama pelanggan yang Anda pakai menguji tetap milik Anda.
Tak ada satu pun “pelolosan untuk HTML” — konteksnyalah yang memutuskan
Inilah gagasan yang membuat sisa pokok bahasan ini masuk akal. Browser mengurai sebuah dokumen dalam beberapa keadaan yang berbeda, dan karakter yang sanggup mengakhiri keadaan yang sedang berjalan berbeda pada tiap keadaan. Di dalam badan teks, hanya `<` dan `&` yang bisa memulai sesuatu yang baru, jadi keduanya itulah yang wajib diloloskan. Di dalam nilai atribut berkutip ganda, `<` tak berbahaya dan `"` mematikan, karena tanda kutip mengakhiri atributnya. Di dalam nilai atribut tanpa kutip, sebuah spasi mengakhirinya, demikian pula tab, pergantian baris, tanda petik terbalik, tanda sama dengan, dan kurung sudut penutup. Di dalam blok `<script>`, pelolosan HTML sama sekali tak berguna dan yang Anda butuhkan adalah pelolosan string JavaScript. Inilah sebabnya satu fungsi `escape()` yang dipakai di mana-mana menghasilkan keluaran rusak sekaligus kerentanan sungguhan: ia meloloskan berlebih di tempat karakternya aman, dan kurang di tempat yang tidak. Memilih konteks sebelum mengodekan bukan kehalusan tambahan — itulah seluruh keputusannya.
Hanya segelintir karakter yang pernah perlu berubah
Perlu diketahui betapa pendek daftarnya, karena kebanyakan pelolosan berlebih lahir dari ketidaktahuan itu. Karakter yang bermakna sintaktis di HTML adalah `<`, `>`, `&`, `"`, dan tanda petik tunggal. Dari semuanya, `&` selalu perlu diloloskan karena ia memulai sebuah entitas, dan `<` selalu perlu karena ia memulai sebuah tag. `>` lebih merupakan kesopanan daripada keharusan di dalam badan teks — browser menampilkan `>` telanjang dengan baik-baik saja — walau meloloskannya sudah jadi kebiasaan di sebagian besar basis kode, karena tak memakan ongkos dan menolong bila markup-nya kelak diproses sesuatu yang lebih ketat. Kedua tanda kutip hanya berarti di dalam nilai atribut, dan hanya yang Anda pakai sebagai pembatas. Selebihnya — tiap huruf beraksen, tiap karakter Arab atau Tionghoa, tiap emoji — sama sekali tak perlu diloloskan pada dokumen UTF-8: pengodeannya sudah menangani mereka. Mengubah `café` menjadi `café` itu sah dan hampir selalu sia-sia, serta membuat berkas Anda lebih besar dan lebih sukar dicari.
Bahasa yang hampir seluruhnya ASCII, dan mengapa ampersand justru jadi soalnya
Bahasa Indonesia menempati posisi yang tak biasa di antara delapan bahasa halaman ini: ia ditulis nyaris seluruhnya dengan huruf ASCII polos. Tak ada aksen, tak ada huruf khusus, tak ada tulisan non-Latin. Itu berarti separuh nasihat lazim tentang entitas HTML — yang seluruhnya tentang é, ñ, ß, ş, atau huruf Arab — tak berlaku sama sekali di sini, dan risikonya bergeser ke tempat lain. Yang justru mengenai proyek berbahasa Indonesia adalah ampersand, karena ampersand bertebaran di nama perusahaan dan nama layanan: “Jaya & Putra”, “Tanya & Jawab”, “Syarat & Ketentuan”. Setiap satu di antaranya adalah `&` yang wajib menjadi `&` ketika masuk markup, dan setiap satu adalah kandidat pengodean ganda yang menghasilkan “Syarat & Ketentuan” di judul halaman. Ampersand juga karakter pemisah pada string kueri, jadi sebuah tautan `?kota=Bandung&kategori=umum` di dalam atribut `href` perlu ditulis `&` — bukan karena URL-nya berubah, melainkan karena ia sedang berada di dalam HTML. Dua pelolosan yang berbeda bertumpuk di satu tempat, dan itulah tempat kekeliruannya lahir.
Pengodean ganda adalah cacat yang membuat alat ini ada
Pelolosan itu tak kebal pengulangan, dan melupakannya menghasilkan salah satu cacat paling gampang dikenali di web. Kodekan `&` sekali, Anda dapat `&`. Kodekan hasilnya lagi, Anda dapat `&amp;`, yang tampil di halaman sebagai teks harfiah `&`. Anda pernah melihatnya: judul halaman terbaca “Tom & Jerry”, baris subjek surel dengan `'` di tengah kata, nama produk dikelilingi `"` di hasil pencarian. Ini terjadi karena pelolosan diterapkan pada dua lapis yang tak saling tahu — mesin templat yang meloloskan otomatis, ditambah pengendali yang meloloskan berjaga-jaga sebelum menyerahkan teksnya. Perbaikannya adalah jangan pernah meloloskan dua kali, dan cara memastikannya adalah meloloskan tepat sekali, pada saat paling akhir yang mungkin, di titik teks itu memasuki markup. Apa pun yang disimpan dalam keadaan sudah diloloskan di sebuah basis data pada akhirnya akan diloloskan lagi oleh apa pun yang menampilkannya.
Entitas bernama adalah fitur HTML, bukan fitur teks
HTML5 mendefinisikan lebih dari dua ribu entitas bernama, dari ` ` dan `©` yang akrab sampai hal seperti `⨂`. XML mendefinisikan tepat lima: `<`, `>`, `&`, `"`, dan `'`. Jurang itu menyebabkan satu kegagalan yang khas dan umum. Taruh ` ` di sebuah umpan RSS, berkas SVG, dokumen XHTML, tata letak Android, atau muatan SOAP, dan Anda mendapat galat penguraian, karena penguraiannya tak pernah mendengarnya dan entitas tak terdefinisi bersifat fatal di XML alih-alih sekadar diabaikan. Bentuk numerik ` ` bekerja di mana saja, sebab ia tak memerlukan definisi. Ada jebakan cerminnya: `'` termasuk lima milik XML tetapi tak ada di HTML4, jadi dokumen HTML lama dan sebagian klien surel menampilkannya sebagai teks harfiah. Kalau sebuah teks mungkin bepergian antarformat — dan sebagian besar teks pada tumpukan modern memang begitu — rujukan numerik adalah ejaan yang aman.
Meloloskan bukanlah menyanitasi, dan bedanya penting
Keduanya terus-menerus dicampuradukkan, dan di dalam pencampuran itulah bug injeksi bersarang. Meloloskan mengambil teks lalu membuatnya aman ditaruh ke sebuah konteks tertentu, supaya ia ditampilkan alih-alih ditafsirkan. Menyanitasi mengambil markup yang memang dimaksudkan tetap menjadi markup lalu membuang bagian-bagiannya yang berbahaya. Meloloskan sebuah komentar sebelum mencetaknya itu benar; meloloskan bidang teks kaya yang boleh diformat pengguna justru menghancurkan formatnya, dan tanggapan yang lazim — membiarkan HTML-nya lewat tanpa diloloskan — itulah yang sungguh-sungguh membuka lubangnya. Contoh paling tajam dari bedanya adalah sebuah URL: kodekan sebuah tautan dengan entitas dan `javascript:alert(1)` selamat utuh sepenuhnya, karena pemecahan entitas terjadi sebelum skema URL-nya diperiksa, jadi `javascript:` kembali menjadi `javascript:` lalu berjalan. Sebanyak apa pun pelolosan HTML tak melindungi sebuah `href`; hanya memvalidasi skemanya yang melindungi. Pelolosan memecahkan tepat satu masalah, dan mengetahui yang mana itulah intinya.
Kesalahan umum yang sebaiknya dihindari
- Memakai satu fungsi pelolosan di mana-mana. Badan teks, nilai atribut, dan blok skrip berakhir pada karakter yang berbeda, jadi satu fungsi meloloskan berlebih di satu tempat dan kurang di tempat lain.
- Meloloskan teks yang sama dua kali. Pelolosan tak kebal pengulangan — `&` menjadi `&` lalu `&amp;`, itulah sebabnya judul halaman terbaca “Tom & Jerry”.
- Lupa bahwa ampersand di nama seperti “Syarat & Ketentuan” harus menjadi `&` di dalam markup. Ini kekeliruan yang paling sering mengenai teks berbahasa Indonesia, yang selebihnya sudah ASCII polos.
- Menaruh entitas bernama di XML. Di sana hanya lima yang terdefinisi, jadi ` ` adalah galat penguraian fatal pada umpan, SVG, atau XHTML; ` ` bekerja di mana saja.
- Memercayai pengodean entitas membuat sebuah URL aman. Entitas dipecahkan sebelum skemanya diperiksa, jadi `javascript:` kembali menjadi `javascript:` lalu berjalan.
Perbandingan
| Aspek | Alat ini | Pengode daring | Sebuah pustaka bahasa |
|---|---|---|---|
| Teks dikirim ke server | Tidak pernah | Umumnya ya | Tidak |
| Membiarkan Anda memilih konteks | Ya | Jarang | Umumnya |
| Memperingatkan pengodean ganda | Ya | Tidak | Tidak |
| Keluaran numerik untuk XML | Ya | Kadang | Bisa dikonfigurasi |
| Memecahkan seluruh himpunan HTML5 | Ya | Sebagian | Umumnya |
| Harga | Gratis | Gratis / paket berbayar | Gratis |
Fitur
Mengodekan dan memecahkan
Dua arah, agar memeriksa apa yang dihasilkan sebuah sistem semudah menyiapkan apa yang hendak Anda kirim.
Pengodean minimal atau penuh
Loloskan hanya karakter yang dituntut konteksnya, atau tiap karakter di luar ASCII, tergantung tujuan teksnya.
Dukungan entitas bernama
Himpunan bernama HTML5 lengkap dikenali saat memecahkan, termasuk ekor panjang yang nyaris tak pernah diketik orang.
Heksadesimal dan desimal
Rujukan numerik dibaca dan ditulis dalam dua ejaan, karena dokumen sungguhan memuat keduanya.
Deteksi pengodean ganda
Entitas yang sudah ada pada masukan disorot sebelum Anda mengodekannya untuk kedua kali.
Masukan besar didukung
Satu templat utuh atau ekspor panjang terkonversi tanpa unggahan maupun plafon ukuran.
Tanpa instalasi
Tanpa alat build, tanpa runtime, tanpa dependensi — jalan di halaman web.
Ramah Arab dan RTL
Antarmuka lengkap dalam delapan bahasa, termasuk Arab kanan-ke-kiri.
Aman secara bawaan
Disajikan lewat HTTPS, tanpa pelacakan konten dan tanpa unggahan ke pihak ketiga.
Siapa yang memakainya
Pengembang web
Memeriksa bagaimana sebuah teks berperilaku setelah berada di dalam nilai atribut.
Pengembang surel
Menyiapkan baris subjek dan badan pesan untuk klien yang mengurai dengan ketat.
Penulis teknis
Menampilkan contoh kode di sebuah halaman tanpa browser mencoba menjalankannya.
Siapa pun yang melacak teks rusak
Memecahkan teks yang tiba dengan `&amp;` di tengahnya.
Pertanyaan yang Sering Diajukan
Tidak. Semuanya berjalan lokal di browser Anda — teks Anda tidak pernah diunggah, disimpan, atau dibagikan.
Ya — sepenuhnya gratis, tanpa akun dan tanpa batas.