What is URL Percent-Encoding (RFC 3986)?
Uniform Resource Identifiers (URIs) are constrained by the RFC 3986 standard to a specific subset of standard US-ASCII characters. Characters outside this set (including spaces, non-ASCII Unicode characters, and punctuation symbols with reserved syntactic meanings such as ?, &, =, and /) must be percent-encoded before transmission over HTTP.
In percent-encoding, non-permitted characters are converted into their corresponding UTF-8 hexadecimal byte values, prefixed with a percent sign (%).
Component Encoding vs. Full URL Encoding
Choosing the appropriate encoding scope is critical to avoid broken links:
- Component Mode (
encodeURIComponent): Replaces all reserved delimiters (?,=,&,/,:). Use this mode whenever you are passing a string into a single query parameter value (e.g.?return_url=https%3A%2F%2F...) so that delimiters do not corrupt the outer query structure. - Full URI Mode (
encodeURI): Preserves the structural syntax of complete URLs (such ashttps://, slashes, and parameter separators) while encoding spaces (%20) and multibyte Unicode characters.
Practical Examples
Comparing the output between the two modes for an identical input string:
Input: "https://example.com/search?query=hello world&tag=dev"
Component Mode:
https%3A%2F%2Fexample.com%2Fsearch%3Fquery%3Dhello%20world%26tag%3Ddev
Full URI Mode:
https://example.com/search?query=hello%20world&tag=dev
Frequently Asked Questions
encodeURIComponent is designed to encode individual query parameter values or path segments; it encodes special URL delimiter characters such as / (slash), ? (question mark), & (ampersand), and = (equals). Conversely, encodeURI is meant for complete URL strings, preserving structural protocol and path separators (://, /, ?, &) while only encoding spaces and non-ASCII Unicode characters.
RFC 3986 defines URI syntax where all characters outside the unreserved character set (A-Z, a-z, 0-9, -, _, ., ~) must be represented as a percent sign (%) followed by the two-digit hexadecimal representation of each corresponding UTF-8 byte. For instance, a space character (ASCII 32 / hex 0x20) is encoded as %20.
Yes. Multibyte Unicode characters (such as accented letters, Asian characters, Arabic, Cyrillic, or emojis) are converted into their respective sequence of UTF-8 percent-encoded bytes (for example, the letter "é" becomes %C3%A9, and emoji 👋 becomes %F0%9F%91%8B).
A URI malformed error occurs when the input contains a percent sign (%) that is not followed by two valid hexadecimal characters (0-9, A-F), or when a multibyte UTF-8 byte sequence is incomplete or truncated.