JS encodes and decodes URLs (three ways to distinguish them)

Little scum · Posted on 1/23/2019 3:06:04 PM

Only 0-9[a-z] $ - _ . + ! * ' ( ), and certain reserved words can be used directly in URLs without encoding.

For example, if you search for a Chinese keyword, copy the URL and then paste it to find that the URL has been transcoded.

1. Escape and Unescape

Principle: Divide ASCII letters, numbers, punctuation marks @ * _ + - . /

Code: escape('http://www.baidu.com?name=zhang@xiao@jie&order=1')

Result: "http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1"

escape('Zhang')

Result: "%u5F20"

decoded: unescape("http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1")

Result: "http://www.baidu.com?name=zhang@xiao@jie&order=1"

unescape("%u5F20")

Result: "Zhang"

2. encodeURI and decodeURI

Principle: Returns a string encoded as a valid Uniform Resource Identifier (URI), a character that is not encoded:! @ # $ & * ( ) = : / ; ? + '

encodeURI() is the function in Javascript that is actually used to encode URLs.

Encoding: encodeURI('http://www.baidu.com?name=zhang@xiao@jie&order=1')

Result: "http://www.baidu.com?name=zhang@xiao@jie&order=1"

decoding: decodeURI("http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1")

Result: "http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1"

3. encodeURIComponent and decodeURIComponent

Principle: Encode the components of a URL individually, not the entire URL

Encoding: encodeURIComponent('http://www.baidu.com?name=zhang@xiao@jie&order=1')
Result: "http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhang%40xiao%40jie%26order%3D1"

decoding: decodeURIComponent("http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhang%40xiao%40jie%26order%3D1")

"http://www.baidu.com?name=zhang@xiao@jie&order=1"

[JavaScript] JS encodes and decodes URLs (three ways to distinguish them)

Related Posts

Sections viewed