javaScript encodeURL与encodeURLComponent区别

最新推荐文章于 2025-02-10 19:47:52 发布

飘走的落不离

最新推荐文章于 2025-02-10 19:47:52 发布

阅读量1.7k

点赞数 1

文章标签： es6 typescript 前端

本文链接：https://blog.youkuaiyun.com/gebieren/article/details/108080283

版权

本文深入探讨了URL编码与解码的基本概念，讲解了Global对象的encodeURL()和encodeURLComponent()方法如何处理URL中的特殊字符，以及decodeURI()和decodeURIComponent()方法如何将编码后的URL还原。通过具体示例，读者可以了解这些方法在实际应用中的工作原理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1. URL编码及解码方式

Global对象的encodeURL()和encodeURLComponent()方法可以对URL进行编码。有效的URL中不能包含某些字符串，例如空格。他们用特殊的UTF-8编码替换所有无效的字符，从而让浏览器理解。
encodeURL()主要用于整个URL，而encodeURLComponent()主要用于对URL中的某一段。它们的区别在于，encodeURL()不会对本身属性url的特殊字符进行编码，例如“冒号、正斜杠、问号、井号”；而encodeURLComponent()则会对它发现的任何非标准字符进行编码。

  let url = 'https://www.baidu.com/123456789/story'
  let encode = encodeURI(url) 
  let encodeComponent = encodeURIComponent(url)
  console.log(encode) // https://www.baidu.com/123456789/story
  console.log(encodeComponent) // https%3A%2F%2Fwww.baidu.com%2123456789%2Fstory
 let decode = decodeURI(encode) // encode 对应上面的代码
 let decodeComponent = decodeURIComponent(encodeComponent)
 console.log(decode) // https://www.baidu.com/123456789/story
 console.log(decodeComponent) // https://www.baidu.com/123456789/story

在请求拦截器中使用列子：