Article directory
1. escape
escape is to encode the string
What it does: Make them readable on all computers
Deprecated\color{#ea4335}{Deprecated}Deprecated : This feature has been removed from the Web standard. Although some browsers still support it, they may stop supporting it at some time in the future. Please try not to use this feature.
The deprecated escape() method generates a new string replaced by a hexadecimal escape sequence. Use encodeURI or encodeURIComponent instead.
2. encodeURI
The encodeURI() function encodes a Uniform Resource Identifier (URI) by replacing each instance of a specific character with one, two, three, or four escape sequences
encodeURI replaces all characters except the following characters, even if they have appropriate UTF-8 escape sequences:
| type | Include |
|---|---|
| reserved characters | ; , / ? : @ & = + $ |
| Unescaped characters | Alphanumeric - _ . ! ~ * ' ( ) |
| Number symbols | # |
三、encodeURIComponent
The encodeURIComponent() function encodes a URI by replacing each instance of some character with one, two, three, or four UTF-8 encoded escape sequences representing the character (the two definitions are basically the same)
encodeURI replaces all characters except the following characters, even if they have appropriate UTF-8 escape sequences:
| type | Include |
|---|---|
| Unescaped characters | Alphanumeric - _ . ! ~ * ' ( ) |
So encodeURIComponent has a wider encoding range than encodeURI.
4. The difference between encodeURI and encodeURIComponent
var set1 = ";,/?:@&=+$"; // 保留字符
var set2 = "-_.!~*'()"; // 不转义字符
var set3 = "#"; // 数字标志
var set4 = "ABC abc 123"; // 字母数字字符和空格
console.log(encodeURI(set1)); // ;,/?:@&=+$
console.log(encodeURI(set2)); // -_.!~*'()
console.log(encodeURI(set3)); // #
console.log(encodeURI(set4)); // ABC%20abc%20123 (the space gets encoded as %20)
console.log(encodeURIComponent(set1)); // %3B%2C%2F%3F%3A%40%26%3D%2B%24
console.log(encodeURIComponent(set2)); // -_.!~*'()
console.log(encodeURIComponent(set3)); // %23
console.log(encodeURIComponent(set4)); // ABC%20abc%20123 (the space gets encoded as %20)
As can be seen from the above code, encodeURIComponent escapes reserved characters and numeric flags compared to encodeURI
5. Usage occasions
- Assuming a URI is a complete URI, then use encode URI \color{#ea4335}{encodeURI}en c o d e U R I does not need to encode characters that are reserved and have special meaning in URIs .
- In GET and POST requests, use encode URIC omnient \color{#ea4335}{encodeURIComponent}e n c o d e U R I C o m p o n e n tThis method will encode these characters
Necessary: To avoid unpredictable requests to the server, you need to escape any user input as part of a URI using encodeURIComponent.
Reason:
If a user enters "abc&time=123" as part of filling in the comment variable, if it is not escaped using encodeURIComponent, the server will get component=abc&time=123. At this time, the server gets two key-value pairs, so a parameter error occurs. Therefore, when escaping the content entered by the user, the encodeURIComponent() function must be used.
Reference links: