当前位置：首页 > article >正文

encodeURI()，encodeURIComponent()区别

article 2025/2/13 2:40:35

encodeURI()，encodeURIComponent()区别

encodeURI(): 对整个url(链接/网络链接)进行编码。
对中文，完全编码。
对英文不带空格则不会编码，带空格则会对空格编码。
解码：decodeURI()

例如：
let ChineseUrl = "https://baidu.com/uat/share?server=服务器&language=英语&shareId=0123456&sport=足球&subject=运动&name=鱼&testResult=成功&nobanner=true";
ChineseUrl = encodeURI(ChineseUrl); 
console.log(ChineseUrl);
// https://baidu.com/uat/share?server=%E6%9C%8D%E5%8A%A1%E5%99%A8&language=%E8%8B%B1%E8%AF%AD&shareId=0123456&sport=%E8%B6%B3%E7%90%83&subject=%E8%BF%90%E5%8A%A8&name=%E9%B1%BC&testResult=%E6%88%90%E5%8A%9F&nobanner=true

let EnglishUrl = "https://baidu.com/uat/share?server=server&language=en&shareId=0123456&sport=football&subject=sport&name=yu&testResult=success&nobanner=true";
EnglishUrl = encodeURI(EnglishUrl);
console.log(EnglishUrl);
// https://baidu.com/uat/share?server=server&language=en&shareId=0123456&sport=football&subject=sport&name=yu&testResult=success&nobanner=true

let EnglishUrl2 = "https://baidu.com/uat/share?server=https:example.com/?language=en&shareId=0123456&sport=football&subject=sport&name=zhang san&testResult=success&nobanner=true";
EnglishUrl2 = encodeURI(EnglishUrl2);
console.log(EnglishUrl2);
// https://baidu.com/uat/share?server=https:example.com/?language=en&shareId=0123456&sport=football&subject=sport&name=zhang%20san&testResult=success&nobanner=true

encodeURIComponent(): 对url(链接/网络链接)的问号（？）后进行编码
encodeURIComponent(): 对整个url(链接/网络链接)进行编码，在浏览器不会打开。
对中文，完全编码。
对英文不带空格则不会编码，带空格则会对空格编码。
解码：decodeURIComponent()

let ChineseUrl = "https://baidu.com/uat/share?server=服务器&language=英语&shareId=0123456&sport=足球&subject=运动&name=张三&testResult=成功&nobanner=true";
ChineseUrl = encodeURIComponent(ChineseUrl);
console.log(ChineseUrl);
// https%3A%2F%2Fbaidu.com%2Fuat%2Fshare%3Fserver%3D%E6%9C%8D%E5%8A%A1%E5%99%A8%26language%3D%E8%8B%B1%E8%AF%AD%26shareId%3D0123456%26sport%3D%E8%B6%B3%E7%90%83%26subject%3D%E8%BF%90%E5%8A%A8%26name%3D%E5%BC%A0%E4%B8%89%26testResult%3D%E6%88%90%E5%8A%9F%26nobanner%3Dtrue

let chineseServer = "服务器";
chineseServer = encodeURIComponent(chineseServer);
let chineseLanguage = "英语";
chineseLanguage = encodeURIComponent(chineseLanguage);
let chineseShareId = "0123456";
chineseShareId = encodeURIComponent(chineseShareId);
let chineseSport = "足球";
chineseSport = encodeURIComponent(chineseSport);
let chineseSubject = "运动";
chineseSubject = encodeURIComponent(chineseSubject);
let chineseName = "张三";
chineseName = encodeURIComponent(chineseName);
let chineseTestResult = "成功";
chineseTestResult = encodeURIComponent(chineseTestResult);
let ChineseUrl2 = `https://baidu.com/uat/share?server=${chineseServer}&language=${chineseLanguage}&shareId=${chineseShareId}&sport=${chineseSport}&subject=${chineseSubject}&name=${chineseName}&testResult=${chineseTestResult}&nobanner=true`;
console.log(ChineseUrl2);
// https://baidu.com/uat/share?server=%E6%9C%8D%E5%8A%A1%E5%99%A8&language=%E8%8B%B1%E8%AF%AD&shareId=0123456&sport=%E8%B6%B3%E7%90%83&subject=%E8%BF%90%E5%8A%A8&name=%E5%BC%A0%E4%B8%89&testResult=%E6%88%90%E5%8A%9F&nobanner=true

let englishServer = "server";
englishServer = encodeURIComponent(englishServer);
let englishLanguage = "en";
englishLanguage = encodeURIComponent(englishLanguage);
let englishShareId = "0123456";
englishShareId = encodeURIComponent(englishShareId);
let englishSport = "football";
englishSport = encodeURIComponent(englishSport);
let englishSubject = "sport";
englishSubject = encodeURIComponent(englishSubject);
let englishName = "zhang san";
englishName = encodeURIComponent(englishName);
let englishTestResult = "success";
englishTestResult = encodeURIComponent(englishTestResult);
let englishUrl = `https://baidu.com/uat/share?server=${englishServer}&language=${englishLanguage}&shareId=${englishShareId}&sport=${englishSport}&subject=${englishSubject}&name=${englishName}&testResult=${englishTestResult}&nobanner=true`;
console.log(englishUrl);
// https://baidu.com/uat/share?server=server&language=en&shareId=0123456&sport=football&subject=sport&name=zhang%20san&testResult=success&nobanner=true