Skip to content
Dogu SangjaToolboxAll tools

URL Encoder & DecoderBeta

Encode and decode URLs and query strings. See the difference between encodeURIComponent and encodeURI with examples, and parse a full URL's structure.

Direction
0 characters · 0 lines
Encoding type
encodeURIComponent escapes everything, including URL delimiters like /, ?, & and #, so use it for a single query parameter value. encodeURI leaves those delimiters alone and escapes only the rest, so use it for a complete URL. Example: "a b/c?d" → component gives "a%20b%2Fc%3Fd", full gives "a%20b/c?d".

0 characters · 0 lines

URL structure parser

URL structure parser

Enter a full URL to see it split into protocol, host, path, and query parameters.

https://example.com/path?query=1&lang=en

How to use

On the Encode tab, type or paste text or a piece of a URL and the result appears right below it. On the Decode tab, paste an encoded string such as %EC%95%88%EB%85%95 and it turns back into the original characters. The result updates as you type, and you can copy it with the button next to it.

encodeURIComponent vs. encodeURI

Both functions turn characters that aren’t safe in a URL into percent-encoded sequences (a % followed by a hex code), but they escape different amounts.

  • encodeURIComponent (one value): escapes everything, including characters used as URL delimiters, such as /, ?, &, #, : and @. Use it to build a single piece of a URL, like the value of one query parameter. For example, to put the search term a/b&c in a query value, you need to encode it as a%2Fb%26c so the & isn’t mistaken for the start of the next parameter.
  • encodeURI (whole URL): meant for a complete URL that already has its structure, using /, ?, &, # and so on. It leaves those delimiters alone and escapes only the rest, such as spaces or non-ASCII characters. Using encodeURIComponent on a full URL would also encode the / and ? that make up the URL’s structure, breaking it.

For example, encoding a b/c?d the two ways gives different results: component gives a%20b%2Fc%3Fd, full gives a%20b/c?d. The choice comes down to whether you’re building one piece of a URL or a complete URL.

“+ as space” (application/x-www-form-urlencoded)

Values submitted by an HTML <form> via GET or POST use the application/x-www-form-urlencoded format, which conventionally encodes spaces as + instead of %20. Turning on “+ as space” makes encoding use + instead of %20, and makes decoding treat + as a space. Turn it on only when working with form submission data or an application/x-www-form-urlencoded request body, and leave it off for a regular URL path or filename. With the option off, + is treated as a literal character.

URL structure parser

Paste a complete URL (including a protocol like https://) into the parser box and it breaks it down into the protocol, host, path, hash, and a table of query parameters. Query values are automatically percent-decoded, so an encoded query string like ?q=hello%20world becomes readable. If the same key appears more than once (?tag=a&tag=b), each occurrence is shown as its own row.

Common errors

Percent-encoding must have two hex digits after each % (like %20). A lone %, a % followed by non-hex characters (%zz), or a broken %XX sequence for a multi-byte character will show a decoding error. Decoding with a different type (component/full) than the one used to encode can also change the meaning, so make sure you pick the same one.

Privacy

Everything you enter is processed inside this browser only and is never sent to a server. It all disappears when you close the page.

Sources

Frequently asked questions

When should I use encodeURIComponent instead of encodeURI?

encodeURIComponent escapes everything, including URL delimiters like /, ?, & and #, so use it to build a single piece of a URL, such as a query parameter's value. encodeURI leaves those delimiters alone and escapes only the rest, so use it for a complete, already-structured URL. Using encodeURI on a query value is risky, since an & or = inside the value could be mistaken for a delimiter.

Why do I get an "invalid percent-encoding" error when decoding?

Percent-encoding must be in the form %XX, where XX is two hexadecimal digits. A lone %, a % followed by non-hex characters, or a broken %XX%XX sequence for a multi-byte character can't be turned back into the original character, so this error appears.

When should I turn on "+ as space"?

When an HTML form submits values via GET or POST (application/x-www-form-urlencoded), spaces are conventionally encoded as + instead of %20. Turn this option on when working with a form's query string or request body so + is correctly read as a space. Leave it off for a regular URL path.

What does the URL structure parser show me?

Paste in a complete URL starting with https:// and it shows the protocol, host (domain and port), path, hash (after #), and the query parameters as a key-value table. Values are automatically percent-decoded, so an encoded query string becomes readable.