JavaScript decodeURI() Function – Decoding URLs Encoded with encodeURI()

Definition and Usage

The decodeURI() function is used to decode a URL that was encoded using encodeURI().

It decodes only the special characters encoded by encodeURI().

Features

Does not decode characters that encodeURI() does not encode, such as /, ?, :, &, and #.
To decode URLs that include these characters, use decodeURIComponent() instead.

Basic Example

JavaScript

const uri = "https://www.example.com/?x=Sample Value";
const encoded = encodeURI(uri);

console.log(encoded);
// Output: "https://www.example.com/?x=Sample%20Value"

const decoded = decodeURI(encoded);

console.log(decoded);
// Output: "https://www.example.com/?x=Sample Value"

The decodeURI() function has the following syntax:

Syntax

Parameters

Parameters of the `decodeURI()` function
`encodedURI`	The encoded URI string to decode. This function decodes the given encoded URI string back into its regular text form.

Return value

Returns a new string that is the decoded version of the given encodedURI string.

Characters Not Encoded by `decodeURI()`

The decodeURI() function decodes only the characters encoded by encodeURI(). However, it does not decode the # character.

Example

JavaScript

const originalURI = "https://example.com/email list"; // URL with a space
const encodedURI = encodeURI(originalURI);            // Space encoded as %20
const decodedURI = decodeURI(encodedURI);             // Decoding back to original

console.log(encodedURI); // Output: "https://example.com/email%20list"
console.log(decodedURI); // Output: "https://example.com/email list"

This clearly demonstrates how encodeURI() and decodeURI() work with special characters in URLs.

Important Note

Be careful when decoding a URI encoded with encodeURIComponent() using decodeURI(), as it may only partially decode the string.

JavaScript

const uriComponent = "https://www.example.com/search?q=JavaScript & Web Development";
const encodedUriComponent = encodeURIComponent(uriComponent);

console.log(encodedUriComponent);
// Output: "https%3A%2F%2Fwww.example.com%2Fsearch%3Fq%3DJavaScript%20%26%20Web%20Development"

const decodedUri = decodeURI(encodedUriComponent);

console.log(decodedUri);
// Output: "https%3A%2F%2Fwww.example.com%2Fsearch%3Fq%3DJavaScript %26 Web Development"

As shown above, decoding a URI encoded with encodeURIComponent() using decodeURI() only partially decodes it. In such cases, you should use decodeURIComponent() to fully decode the string.

JavaScript

const uriComponent = "https://www.example.com/search?q=JavaScript & Web Development";
const encodedUriComponent = encodeURIComponent(uriComponent);
console.log(encodedUriComponent);
// Output: "https%3A%2F%2Fwww.example.com%2Fsearch%3Fq%3DJavaScript%20%26%20Web%20Development"

const decodedUri = decodeURIComponent(encodedUriComponent);
console.log(decodedUri);
// Output: "https://www.example.com/search?q=JavaScript & Web Development"