• encodeURIComponent: Best for query parameter values
• encodeURI: Full URL encoding (preserves :/? etc.)
🔗 What is URL Encoding?
URL encoding (Percent-encoding) converts characters that are not allowed in URLs into %XX format. It is essential for safely transmitting URLs containing spaces, special characters, or non-ASCII characters. Following RFC 3986, reserved characters and non-ASCII characters are first converted to UTF-8 byte sequences, then each byte is represented as %HH. It is one of the most fundamental encoding methods in web development.
⚙️ encodeURI vs encodeURIComponent
encodeURIComponent (Recommended)
Use for encoding query parameter values. Encodes all URL delimiters including =, &, ?, /, : so special characters in parameter values are handled safely.
?name=encodeURIComponent("John&Jane")encodeURI (Full URL)
Use for encoding complete URLs. Preserves URL structure characters like :, /, ?, #, & while encoding everything else.
encodeURI("https://example.com/search?q=hello world")Frequently Asked Questions
Why is URL encoding necessary?▼
URLs only allow ASCII characters. Spaces, special characters, and non-ASCII text must be converted to %XX format so browsers and servers can interpret them correctly.
Should spaces be encoded as + or %20?▼
encodeURIComponent encodes spaces as %20. The + sign is only used in application/x-www-form-urlencoded format (HTML forms).
Why do encoded URLs look so long?▼
Non-ASCII characters like CJK text are first converted to UTF-8 bytes, where each character may produce 3 bytes (%XX%XX%XX). This is normal and ensures cross-platform compatibility.
What is URL Encoder/Decoder?
Encode special characters in URLs using percent-encoding and decode percent-encoded URLs back to readable text. Essential for handling query parameters, API requests, and web development.