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.jsExpress, Koa✅ 是
PythonFlask, Django✅ 是
JavaSpring MVC✅ 是
PHP原生 / Laravel✅ 是
Gonet/http✅ 是
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值