URL encoding explained

A URL can only contain a limited set of characters. Spaces, non-English letters and symbols with a special meaning, such as & ? # and /, must be written as a percent sign followed by two hexadecimal digits.

A space becomes %20, an ampersand becomes %26 and é becomes %C3%A9, because the letter is first converted to its UTF-8 bytes.

Letters, digits and the symbols - _ . ~ are unreserved and never need encoding. Reserved characters such as : / ? # & = have jobs in the URL structure and are only encoded when they appear as data.

That is why a search term like fish & chips must be encoded when placed in a query string: an unencoded & would start a new parameter.

In JavaScript, encodeURIComponent encodes everything except unreserved characters and is the right choice for a single value, such as a query parameter. encodeURI leaves characters like / ? & alone and is meant for a complete URL.

Using encodeURI on a value can leave an & unescaped and break the query string.

Decoding turns each %XX back into its byte. A malformed sequence, such as a % followed by non-hex characters, is an error.

In HTML form data, a plus sign stands for a space, while in a URL path it is a literal plus. Our decoder treats + as a space, as form-style query strings do.