URL Encoding di JavaScript — encodeURI, encodeURIComponent, dan Praktik Terbaik

JavaScript menyediakan dua fungsi bawaan untuk URL encoding:

encodeURIComponent()

Mengenkode semua karakter kecuali: A-Z a-z 0-9 - _ . ! ~ * ' ( )

const name = 'John Doe'
const query = '?name=' + encodeURIComponent(name)
// ?name=John%20Doe

Gunakan ini untuk mengenkode nilai parameter query individual, segmen path, atau data apa pun yang menjadi bagian dari URL.

encodeURI()

Mengenkode semua karakter kecuali yang di atas ditambah karakter URL yang dicadangkan: : / ? # [ ] @ ! $ & ' ( ) * + , ; =

const url = 'https://example.com/search?q=hello world'
const encoded = encodeURI(url)
// https://example.com/search?q=hello%20world

Gunakan ini saat mengenkode string URL lengkap.

Jebakan Umum

// SALAH — merusak struktur URL
encodeURIComponent('https://example.com/page')
// https%3A%2F%2Fexample.com%2Fpage

// BENAR — mempertahankan struktur
encodeURI('https://example.com/page')
// https://example.com/page

Uji fungsi-fungsi ini secara langsung dengan alat URL encoder/decoder.