This JavaScript article shows you the reason of using encode/decode JavaScript methods for the data; and the solutions for this trouble. Just a little post, but this tutorial is still useful & helpful whether you knew or not.

• Demo
• Enlarge
• Reload
• New window

Why url encoding needed?

All NON-ASCII characters need to be converted to %xx value for a url.
Spaces and special characters can break the url.
Something like "encoding_test.php?q=hello world" need to converted into "firstpage.php?q=hello%20world".
Most modern browser do this job most of the time. So, we do not face much problem. But this can be a necessity
when some other application is consuming data through URL.

For security reason, escaping the string is required.

Sometimes we need to pass special characters like '&' (ampersand) in query string. '&' is used for
separating Key=Value pair. So, if I need to pass
?q=PHP&MySQL then q=PHP and MySQL be a single key without any value (MySQL="").

<?php
var_dump($_GET);
?>

<a href="/javascript/article/JavaScript_encodeURI_decodeURI.php/javascript:location='encodeTest.php?q=' + encodeURIComponent('PHP&MySQL')"> url component encoding</a>
<a href="/javascript/article/JavaScript_encodeURI_decodeURI.php/?q=PHP&MySQL">TEST url encoding </a>

-------------------

URL Encode and Decode

encodeURI() replaces all characters with the appropriate UTF-8 escape sequences, except the following:
; , / ? : @ & = + $ - _ . ! ~ * ' ( ) #

URL Decode

encodeURI() has a decodeURI() for decoding encodeURI() encoded url string.

encodeURIComponent:

encodeURIComponent escapes all characters except the following: alphabetic, decimal digits, - _ . ! ~ * ' ( )
Use this function for encoding url components (key=value) and not for whole url encoding.
and this function is required to be used to escape any data taken from users and passed to the server for security reason.

escape:

The escape() function encodes a string, so it can be read on all computers.

Source: W3Schools

escape() returns ISO-Latin-1 character set and not the Unicode.
The escape() function encodes spaces, punctuation, and any other character that is not an ASCII alphanumeric character, with the exception of: * @ - _ + . /

Escape() has unescape() function to get the original encoded html using escape() function.
unescape returns the ASCII string.

The escape and unescape functions do not work properly for non-ASCII
characters and have been deprecated. In JavaScript 1.5 and later, use encodeURI, decodeURI, encodeURIComponent, and
decodeURIComponent.

Source: https://developer.mozilla.org

Sample of encoding effect:
Original: "<script>alert('a')</script>"
%3Cscript%3Ealert%28%27a%27%29%3C/script%3E - escape
%3Cscript%3Ealert('a')%3C/script%3E - encodeURI
%3Cscript%3Ealert('a')%3C%2Fscript%3E - encodeURIComponent

Reference:
https://developer.mozilla.org/en/Core_JavaScript_1.5_Reference/Global_Functions/encodeURI
http://docs.sun.com/source/816-6408-10/toplev.htm

• Code
• Print

• Comment (0)
• Write

• Sent (0)
• New