encodeURI、encodeURIComponent的区别

264 阅读1分钟

encodeURI \ decodeURI

对URI(Uniform Resource Identifier, 统一资源标识符)进行编码, encodeURI方法 不会ASCII字母 数字 ~!@#$&*()=:/,;?+' 进行编码 

decodeURI对其解码

encodeURIComponent \ decodeURIComponent

对URI(Uniform Resource Identifier, 统一资源标识符)进行编码, 此函数不会对 ASCII字母、数字 ~!*()' 进行编码

对于使用encodeURIComponent的结果,用decodeURIComponent进行解码。

区别

encodeURIComponent相较于encodeURI,会对 @#$=/&:,;+ 进行编码。

encodeURI适用于编码整个URL,因为https:// 部分的斜杠不会被编码,还能正常使用;

encodeURIComponent适用于编码URL中的参数,此时需要对于部分的参数进行更进一步的编码。

let encoded = encodeURIComponent("https://cn.bing.com/search?q=你好")

console.log(encoded)
// 输出: https%3A%2F%2Fcn.bing.com%2Fsearch%3Fq%3D%E4%BD%A0%E5%A5%BD
// 可以看到对于https后面的 :// 也进行了编码

console.log(decodeURIComponent(encoded))
// 输出: https://cn.bing.com/search?q=你好

let encoded1 = encodeURI("https://cn.bing.com/search?q=你好")
console.log(encoded1)
// 输出: https://cn.bing.com/search?q=%E4%BD%A0%E5%A5%BD

let encoded2 = encodeURI("https://cn.bing.com/search?q=/你好")
// 此时query参数中有/字符
console.log(encoded2)
// 输出: https://cn.bing.com/search?q=/%E4%BD%A0%E5%A5%BD
// / 并没有被编码,应该使用encodeURIComponent