encodeURIComponent () usage in JavaScript

Source: Internet
Author: User

The encodeURIComponent () function encodes a string as a URI component.

Syntax: encodeURIComponent (uristring)

Parameter description: uristring required. A string that contains the URI component or other text to encode.

Return value: A copy of the uristring in which some of the characters will be replaced by the hexadecimal escape sequence.

Note: This method does not encode ASCII letters and numbers, and does not encode these ASCII punctuation marks: –_. ! ~ * ' (). Other characters (such as:;/?:@&=+$,# the punctuation marks used to separate the URI components) are replaced by one or more hexadecimal escape sequences.

Tip: Note the difference between the encodeURIComponent () function and the encodeURI () function, which assumes that its arguments are part of the URI (such as protocol, host name, path, or query string). Therefore, the encodeURIComponent () function escapes the punctuation marks used to separate parts of the URI.

Instance:

In this case, we will encode the URI using encodeURIComponent ():

  code is as follows copy code

<script Type= "Text/javascript"
 document.write (encodeURIComponent ("http://www.w3school.com.cn"));
 document.write ("<br/>");
 document.write (encodeURIComponent ("http://www.w3school.com.cn/p 1/"));
 document.write ("<br/>");
 document.write (encodeURIComponent (",/?:@&=+$#"));
</script>

Output:

Http%3a%2f%2fwww.111cn.net
http%3a%2f%2fwww.111cn.net%2fp%201%2f
%2c%2f%3f%3a%40%26%3d%2b%24%23

Escape () Method:
The specified string is encoded using the ISO Latin character set. All spaces, punctuation, special characters, and other non-ASCII characters will be converted into%XX-formatted character encodings (XX equals the encoded 16 digits of the character in the character set table). For example, spaces's corresponding encoding is%20. The Unescape method is the opposite. Characters that will not be encoded by this method: @ */+

encodeURI () Method:
Converts the URI string into a string in escape format using the UTF-8 encoding format. Characters that will not be encoded by this method:! @ # $& * () =:/;? +

encodeURIComponent () Method:
Converts the URI string into a string in escape format using the UTF-8 encoding format. This method encodes more characters than encodeURI (), such as/or characters. So if a string contains several parts of the URI, this method cannot be encoded, otherwise the URL will display an error after the/character is encoded. Characters that will not be encoded by this method:! * ( )

Therefore, for Chinese strings, you only need to use escape if you do not want to convert the string encoding format into a UTF-8 format (such as when the original page and the target page charset are consistent). If your page is GB2312 or other code, and the page that accepts the parameter is UTF-8 encoded, you should use encodeURI or encodeuricomponent.

In addition, Encodeuri/encodeuricomponent was introduced after javascript1.5, and escape was in the javascript1.0 version.

The garbled problem of uploading to the server via JS encodeURIComponent

Second, the resolution process: (1) in the JSP using encodeURIComponent to encode, two times code:

The code is as follows Copy Code

Content=encodeuricomponent (content) (encodeuricomponent);
var url= "${pagecontext.request.contextpath}/blogaction.do?method=dopublishblog&content=" +content;

Content=encodeuricomponent (content) (encodeuricomponent);
var url= "${pagecontext.request.contextpath}/blogaction.do?method=dopublishblog&content=" +content;

(2) using decoding in action:

Java code

The code is as follows Copy Code

String content= (String) request.getparameter ("content");
Content=urldecoder.decode (Content, "UTF-8");

String content= (String) request.getparameter ("content");
Content=urldecoder.decode (Content, "UTF-8");

This problem can be solved.


1the difference between encodeURI and encodeuricomponent in JS

The encodeURI method returns an encoded URI. If you pass the encoding result to decodeURI, the original string is returned. The encodeURI method does not encode the following characters: ":", "/", ";" and "?". Please encode these characters using the encodeURIComponent method. After I test "#" also belong to the category of this special character, the use of encodeURI encoding # is not coded, so the problem of the above scene still exists, for this input content, it must be used encodeuricomponent.

(2) IE for the different processing of #, from the following header content can be seen.

The code is as follows Copy Code

IE8:

post/dcwb/blogaction.do?method=dopublishblog&content=%23ի%23&decorator=exclude&gridid=& Gridname=&videoid=&imageid=&topicid=

IE6:

Post/dcwb/blogaction.do?method=dopublishblog&content=%23%20&decorator=exclude&gridid=& Gridname=&videoid=&imageid=&topicid= http/1.1


The most used should be encodeuricomponent, which is to convert Chinese, Korean and other special characters into utf-8 format URL encoding, So if you need to use encodeURIComponent when passing parameters to the background, you need background decoding for utf-8 support (the form is encoded in the same way as the current page encoding)

Escape does not encode 69 characters: *,+,-,.,/,@,_,0-9,a-z,a-z

There are 82 encodeURI not encoded characters:!,#,$,&, ', (,), *,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,a-z

There are 71 encodeuricomponent characters that are not encoded:!, ', (,), *,-,.,_,~,0-9,a-z,a-z

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.