JS encoding/decoding of URL strings

Source: Internet
Author: User

First, why to do JS encoding and decoding?

Only letters and numbers [0-9a-za-z], some special symbols "$-_.+!*" (), "[not including double quotes], and some reserved words can be used without encoding directly for the URL."

What is happening:

The URL path contains Chinese characters

Baidu Baidu Search in the encyclopedia. Then there will be. wd= Baidu and other words.

We opened the Firefox developer tool and observed that the characters were converted into characters.

HTTPS://www.baidu.com/baidu?tn=monline_3_dg&ie=utf-8&wd=%E7%99%BE%E5%BA%A6%E7%99%BE%E7%A7 %91

Second, how to do JS coding and decoding work?

About URL-encoded/JAVASCRIPT/JS URL-encoded/url three JS-encoded functions Escape (), encodeURI (), encodeURIComponent ().

We can directly execute functions directly in the browser's console:

(1) JavaScript function: Escape ()

Escape method: Returns an encoded String object that can be read on all computers.

Characters that are not encoded by this method: @ */+

In fact, escape () cannot be used directly for URL encoding, and its true function is to return a Unicode encoded value of a character. For example, the "Spring Festival" return result is%u6625%u8282, that is, in the Unicode character set, "Spring" is the No. 6625 (hexadecimal) character, "section" is the No. 8282 (hexadecimal) character.

Its specific rules are, in addition to ASCII letters, numbers, punctuation "@ * _ +-". /"To encode all other characters. The symbols between \u0000 and \u00ff are converted into%xx forms, and the remaining symbols are converted into%uxxxx forms.

There are two more places to take care of.

First, regardless of the original encoding of the Web page, once encoded by JavaScript, it becomes a Unicode character. In other words, the input and output of the Javascipt function are Unicode characters by default.

Example:

Coding:

Javascript:escape ("Spring Festival");

Decoding:

Javascript:unescape ("%u6625%u8282");

The effect is as follows:

(2) JavaScript function: encodeURI ()

encodeURI method: Returns a string encoded as a valid Uniform Resource Identifier (URI).

Characters that will not be encoded by this method:! @ # $ & * () =:/;? +

encodeURI () is a function in JavaScript that is really used to encode URLs.

It focuses on encoding the entire URL, so in addition to the usual symbols, there are some other symbols that have special meanings in the URL "; / ? : @ & = + $, # ", also not encoded. After encoding, it outputs the utf-8 form of the symbol and adds a% before each byte.

Example:

Coding:

Javascript:encodeuri ("Spring Festival");

Decoding:

Javascript:decodeuri ("%e6%98%a5%e8%8a%82");

The effect is as follows:

(3) JavaScript function: encodeURIComponent ()

The last JavaScript encoding function is encodeURIComponent (). The difference from encodeURI () is that it is used to encode the part of the URL individually, not the entire URL.

Therefore, "; / ? : @ & = + $, # ", these symbols that are not encoded in encodeURI () are encoded in encodeURIComponent (). As for the specific coding method, the two are the same.

Example:

Coding:
Javascript:encodeuricomponent ("Spring Festival");

Decoding:
Javascript:decodeuricomponent ("%e6%98%a5%e8%8a%82");

The effect is as follows:

JS encoding/decoding of URL strings

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.