URL Encoding (juga dikenal sebagai Percent Encoding) adalah mekanisme untuk merepresentasikan karakter khusus dalam URL menggunakan format %XX, di mana XX adalah nilai heksadesimal. Encoding ini sangat penting untuk pengembangan web, integrasi API, dan transmisi data. Ketika Anda perlu menyertakan karakter khusus seperti spasi, ampersand (&), tanda tanya (?), atau karakter non-ASCII dalam URL atau parameter query, encoding yang tepat memastikan data ditransmisikan dengan aman tanpa merusak struktur URL. Tool ini mendukung dua mode encoding: Encoding URL lengkap (encodeURI) mempertahankan karakter struktur URL seperti :, /, ?, &, = sambil meng-encode karakter khusus lainnya—ideal untuk meng-encode URL lengkap. Encoding komponen (encodeURIComponent) meng-encode semua karakter khusus termasuk karakter struktur URL—sempurna untuk nilai parameter query, data form, dan payload request API. Semua pemrosesan dilakukan di sisi klien di browser Anda tanpa data dikirim ke server.
How to Use
Pilih mode Encode atau Decode menggunakan tombol radio di bagian atas. Untuk encoding: paste teks atau URL Anda ke area input dan output akan otomatis diperbarui dengan hasil yang di-encode. Pilih gaya encoding spasi Anda: %20 (standar, sesuai RFC 3986) atau + (umum dalam query string dan data form). Toggle 'Encode Full URL' untuk beralih antara encoding URL lengkap (mempertahankan :, /, ?, &, =) dan encoding komponen (meng-encode semuanya). Untuk decoding: paste teks URL yang di-encode dan secara otomatis akan di-decode kembali ke format yang dapat dibaca, menangani representasi spasi %20 dan +. Salin output dengan satu klik menggunakan tombol Copy, atau unduh hasil sebagai file teks.
Common Use Cases & Examples
**Parameter Query**: Encode 'smart watch' menjadi 'smart%20watch' atau 'smart+watch' untuk query string URL. **Request API**: Bangun URL API seperti 'https://api.example.com/search?q=elektronik%20%26%20gadget&harga=%3E100' dengan parameter yang di-encode dengan benar. **OAuth & Signature**: Banyak flow OAuth dan algoritma signature API memerlukan parameter yang di-encode URL. **Data Form**: Encode pengiriman form untuk tipe konten application/x-www-form-urlencoded. **Deep Link**: Buat deep link yang di-encode untuk aplikasi mobile dengan parameter. **Debugging**: Decode respons API atau URL bar browser untuk melihat nilai parameter sebenarnya. **Karakter Khusus**: Tangani karakter seperti &, =, ?, #, /, @, :, <, >, ", ', %, +, dan spasi dalam URL.
Limitations & Important Notes
Tool ini menggunakan encoding UTF-8 (standar untuk web modern). Encoding non-UTF-8 tidak didukung. Tool ini menangani encoding URL standar; untuk skema encoding lain (seperti base64 atau entitas HTML), gunakan tool yang sesuai. URL yang sangat panjang (>100KB) dapat menyebabkan masalah performa di browser lama. Urutan persen yang salah format (seperti %ZZ atau urutan yang tidak lengkap) dalam mode decode akan memicu pesan error. Opsi 'Encode Full URL' hanya boleh digunakan untuk URL lengkap yang dimulai dengan http:// atau https://—untuk nilai parameter query saja, gunakan encoding komponen. Ingat bahwa encoding URL meningkatkan ukuran teks: setiap karakter khusus menjadi 3 karakter (%XX), jadi 'hello world' (11 karakter) menjadi 'hello%20world' (13 karakter).
// JavaScript URL Encoding Examples
// Encode full URL (preserves protocol, slashes, etc.)
const fullUrl = 'https://example.com/search?q=hello world';
const encodedUrl = encodeURI(fullUrl);
console.log(encodedUrl);
// https://example.com/search?q=hello%20world
// Encode URL component (encodes all special chars)
const queryParam = 'hello world & special chars';
const encodedParam = encodeURIComponent(queryParam);
console.log(encodedParam);
// hello%20world%20%26%20special%20chars
// Build URL with encoded parameters
const baseUrl = 'https://api.example.com/search';
const params = {
q: 'smart watch',
category: 'electronics & gadgets',
price: '>100'
};
const queryString = Object.entries(params)
.map(([key, value]) =>
`${encodeURIComponent(key)}=${encodeURIComponent(value)}`)
.join('&');
const fullApiUrl = `${baseUrl}?${queryString}`;
console.log(fullApiUrl);
// https://api.example.com/search?q=smart%20watch&category=electronics%20%26%20gadgets&price=%3E100
// Decode URL
const encoded = 'https%3A%2F%2Fexample.com%2Fsearch%3Fq%3Dhello+world';
const decoded = decodeURIComponent(encoded.replace(/\+/g, ' '));
console.log(decoded);
// https://example.com/search?q=hello world
// Handle encoding errors
try {
const malformed = '%E0%A4%A'; // Incomplete UTF-8 sequence
const result = decodeURIComponent(malformed);
} catch (error) {
console.error('Invalid URL encoding:', error.message);
}