js中encodeURIComponent函数使用场景
encodeURIComponent 是 JavaScript 中的一个内置函数,它的作用是:
将字符串编码为可以安全放入 URL 的形式。
✅ 为什么需要它?
URL 中有一些字符是有特殊意义的,比如:
? 用来开始查询参数
& 分隔多个参数
= 连接键和值
空格、中文、特殊符号等等也不能直接放在 URL 中
如果你直接拼接这些字符到 URL 中,浏览器会无法正确识别或者出错。
原始字符串:
var name = "张三&李四";
var token = "abc=123?token";
不编码的结果(拼 URL):
/user/info?name=张三&李四&token=abc=123?token
⚠️ 这会导致 URL 被错误地解析,参数分隔混乱。
✅ 用 encodeURIComponent 编码:
var url = "/user/info?name=" + encodeURIComponent(name) + "&token=" + encodeURIComponent(token);
编码后的结果:
/user/info?name=%E5%BC%A0%E4%B8%89%26%E6%9D%8E%E5%9B%9B&token=abc%3D123%3Ftoken
现在这个 URL 就安全可传输,浏览器和服务器都能正确解码回原文。
✅ 解码(如果需要)
配套的解码函数是 decodeURIComponent(),用来将编码后的字符串还原回原始内容。
var original = decodeURIComponent("%E5%BC%A0%E4%B8%89");
// original = "张三"
总结
encodeURIComponent() 是用来把字符串转成可以安全放在 URL 参数中的格式,防止出错,是构造 URL 查询字符串时的标准做法。
✅ 服务端:通常会自动解码
几乎所有主流后端框架都会自动解码 URL 参数:
后端语言 | 框架 | 会自动解码? |
---|---|---|
Node.js | Express, Koa | ✅ 是 |
Python | Flask, Django | ✅ 是 |
Java | Spring MVC | ✅ 是 |
PHP | 原生 / Laravel | ✅ 是 |
Go | net/http | ✅ 是 |