URL is an abbreviation for Uniform Resource Locator. A URL is the address of a certain Web site. Each valid URL, in principle, links to a different resource. These resources include an HTML page, a CSS document, a picture, etc.
There are several exceptions in practice, the most frequent being a URL linking to a resource that no longer exists or has migrated. Because the Web server handles both the resource represented by the URL and the URL itself, it is up to the web server's owner to properly manage that resource and its associated URL.
URL encoding refers to replacing certain characters in a URL with one or more character triplets composed of the percent character "%" followed by two hexadecimal numbers. The triplet's two hexadecimal digits represent the numeric value of the replacement character. URL encoding’s reverse process is URL decoding.
With the query parameters, while making a GET request to API, encoding and decoding URL and URL components is a common activity in web development. Often, a URL string containing query parameters is constructed, and the response server must decode this URL to comprehend it. Browsers automatically encode URLs, converting some special characters to other reserved characters before making the request.
Using the decodeURI() Method
The decodeURI() method decodes the URI created by encodeURI(). This function takes one parameter, which contains the encoded string. The decoded string is returned by this function (original string).
When the encoded URL contains improper character sequences, a URIError ("malformed URI sequence") exception is thrown. With the character it represents, replaces each escape sequence in the encoded URI but does not decode escape sequences that encodeURI could not have introduced. Escape sequences do not decode the character #.
const decodedURL = decodeURI(url);
The function decodeURI() accepts the input of a URL and decodes it. The value is stored in the variable decodedURL.
In this example, we have taken the input of an encoded URL. The URL is decoded using the decodeURI() function, and the decoded URL is printed on the user's screen.
<html> <body> <h2> Decode a URL using <i> decodeURI() </i> function </h2> <p> Below is the decoded URL: </p> <p id = "root"> </p> <script> let root = document.getElementById("root"); const url = `https://www.google.com/search?q=facebook&rlz=1C1RLNS_enIN812IN812&oq=fac ebook&aqs=chrome..69i57j46i131i199i433i465i512j0i131i433i512l4j0i512j0i13 1i433i512j0i131i433j0i271.4255j0j15&sourceid=chrome&ie=UTF-8`; const decodedURL = decodeURI(url); root.innerHTML = decodedURL; </script> </body> </html>
Using the decodeURIComponent() Method
The decodeURIComponent() method decodes a URI component previously produced by encodeURIComponent or a similar procedure. The decoded version of the specified encoded Uniform Resource Identifier (URI) component is returned as a new string. This method takes a single parameter that contains the encoded string.
This method returns the URL string's decoded component. When used incorrectly, it raises a URIError ("malformed URI sequence") error. Each escape sequence in the encoded URL component is replaced with the character it represents.
const decodedComponent = decodeURIComponent(component);
The function decodeURIComponent() receives the URL component input and decodes it. The value is saved in the variable decodedComponent.
In this example, a component of an encoded URL is taken as input in the component variable. The % signs are a symbol that the component is encoded. The decodeURIComponent() function decodes the URL component, which removes the percent signs and shows the string between them. The decoded component is printed on the user's screen.
<html> <body> <h2> Decode a URL using <i> decodeURIComponent() </i> Method </h2> <p> Below is the decoded URL: </p> <p id = "root"> </p> <script> let root = document.getElementById("root"); const component = "Tutorials%20Point%20Simply%20Easy%20Learning" const decodedComponent = decodeURIComponent(component); root.innerHTML = decodedComponent; </script> </body> </html>
Using the unescape() Method
The unescape() method creates a new string by replacing hexadecimal escape sequences with the character it represents. A function like escape might be used to introduce the escape sequences. A new string with some characters left unescaped.
The unescape function is a global object attribute. This method solely decodes special characters; it is deprecated. @ - +. / * _ are exception characters.
const decodedurl = unescape(encodedURL);
The unescape() function accepts the input of an encoded URL and decodes its characters. The value is stored in the "decodedurl" variable.
<html> <body> <h2> Decode a URL using <i> unescape() </i> Method </h2> <p> Below is the decoded URL: </p> <p id = "root"> </p> <script> let root = document.getElementById("root"); const url = "https://www.twitter.com"; const encodedURL = encodeURI(url); const escapeurl = escape(url); const decodedurl = unescape(encodedURL); root.innerHTML = decodedurl; </script> </body> </html>
- Related Articles
- How to encode and decode URl in typescript?
- PHP – How to decode a MIME header field using iconv_mime_decode() function?
- How to decode a job advertisement?
- How to create a new image from a WBMP file or URL using imagecreatefromwbmp() function in PHP?