WEB - 关于URL编码与常用编码方法

---

目录

• 主要参考：
• URL为何需要编码
• URL如何进行编码
• JavaScript中encodeURI()与encodeURIComponent()的区别（escape()不推荐使用）
• 特例：表单提交中的空格编码问题

---

主要参考：

• URL编码与解码 - 大气象 - 博客园
• 空格URL编码的正确使用姿势 - 沐风 - 开源中国

---

URL为何需要编码

• URL采用ASCII编码，则其他非ASCII字符（如中文等）将无法表示，需要进行编码；RFC3986文档规定了允许出现在URL中的所有可打印字符（不一定安全）：

  • 英文字符（a-zA-Z）；
  • 数字（0-9）；
  • -_.~ 4个特殊字符；
  • 保留字符：!*'();😡&=+$,/?#[]

• 一些不安全字符，如果出现在URL中，可能引起解析歧义，因此需要编码：

  • 空格：在URL传输或用户排版过程中，都可能直接增减空格，因此需对有意义的空格进行编码；
  • 引号以及尖括号：常用于在普通文本中分隔URL，独立使用时需编码；
  • #：常用于表示书签或锚点，独立使用时需编码；
  • %：作为对不安全字符进行编码时使用的特殊字符，独立使用时需要编码；
  • {}|^[]`~：某些网关或传输代理可能会有自定义处理方式，为避免混乱需提前编码

URL如何进行编码

• URL编码的原则：使用安全字符（没有特殊用户或特殊意义的可打印字符）来表示那些不安全字符；

• URL编码也被称为百分号编码，使用百分号%接两个十六进制字符代表一个字节。推荐使用UTF-8编码字符后再对每个字节添加百分号处理，例如：

  • “中文”两个字符经过UTF-8编码后分别为0xE4B8AD、0xE69687；
  • 再经过URL编码后得到%E4%B8%AD%E6%96%87

JavaScript中encodeURI()与encodeURIComponent()的区别（escape()不推荐使用）

• 主要区别： 安全字符不同（即不对这些字符进行编码）

  encodeURI（82个安全字符） > encodeURIComponent（71个安全字符）

• 应用场景：

  • encodeURI()：用于对完整URI进行编码，安全字符中包含了用于分隔URI各组件的保留字符，不会进行编码；
  • encodeURIComponent()：用于对URI中的单个组件进行编码，如果用于编码整个URI，会导致组件混乱

• 解码方法：

  • encodeURI() -> decodeURI()；
  • encodeURIComponent() -> decodeURIComponent()

特例：表单提交中的空格编码问题

• 直观表现：

  • 正常使用上文URL编码时，空格被编码为%20；
  • POST表单提交时，空格被编码为“+”，而“+”本身被编码为%2B

• 原因分析：

  • 表单编码采用application/x-www-form-urlencoded，是按照HTML4规范将空格编码为“+”；
  • 上文所述为RFC-3986采用的统一编码方式

---