URL Encode/Decode

Why URLs need encoding

A URL can only contain a limited set of characters. Spaces, slashes, question marks, ampersands, and most non-ASCII characters either have reserved meaning or are simply not allowed. Percent-encoding solves this by replacing an unsafe byte with a percent sign followed by its two-digit hexadecimal value. A space becomes %20, and a slash becomes %2F.

Where it bites you

The classic bug is a query parameter that contains an ampersand or an equals sign. If a user searches for q=rock & roll and you do not encode it, the server sees a stray parameter boundary and loses part of the value. Encoding the value first keeps it intact.

Example

Input:  https://ex.com/search?q=cats & dogs
Output: https://ex.com/search?q=cats%20%26%20dogs

Notice the space became %20 and the ampersand became %26. In some contexts a space is instead encoded as a plus sign; that convention applies to form bodies, not to the path.

Encode the component, not the whole URL

A frequent mistake is encoding an entire URL at once, which escapes the slashes and colon you actually want to keep. The right approach is to encode each piece (a single query value, one path segment) before you assemble it. In JavaScript that is encodeURIComponent for parts and encodeURI only for a full address.

FAQ

Space becomes %20 or a plus sign, which is right? Both appear in the wild. Use %20 in path and query values; the plus sign is a legacy form-encoding rule for application/x-www-form-urlencoded bodies.

Do I need to encode letters and digits? No. Unreserved characters (A-Z, a-z, 0-9, and - _ . ~) pass through untouched.

How do non-English characters work? They are first converted to UTF-8 bytes, then each byte is percent-encoded, so a single accented letter can expand into several percent groups.