URL编码的学习笔记

关于URL编码

• URL基本知识
  URL的合法字符分成元字符与语义字符，其他字符出现在URL之中都必须转义。
  • 元字符
    分号（;），逗号（,），斜杠（/），问号（?），冒号（:），at（@），&，等号（=），加号（+），美元符号（$），井号（#）
  • 语义字符
    a-z，A-Z，0-9，连词号（-），下划线（_），点（.），感叹号（!），波浪线（~），星号（*），单引号（'），圆括号()
• URL编码方法
  • 为什么要js进行编码
    当URL中有非法字符时，浏览器会自动的帮我们进行转义。既然不合法的URL字符会被浏览器自动的进行转义，那么我们为何又要多此一举的使用js对URL进行在编码转义呢？原因只有一个，那就是不同的操作系统、不同的浏览器、不同的网页字符集将导致完全不同的编码结果。所以我们需要使用js对URL进行编码，不让浏览器插手，以保证编码结果的统一。
  • escape()
    实际上不能直接用于URL编码，它真正的作用是返回一个字符的Unicode编码值。

    var url = 'http://www.baidu.com?name=李四&sex=man';
    url = escape(url)   //"http%3A//www.baidu.com%3Fname%3D%u674E%u56DB%26sex%3Dman"
    

  • encodeURI()
    参数是一个字符串，代表整个URL。它会将元字符和语义字符之外的字符都进行转义。

    var url = 'http://www.baidu.com?name=李四&sex=man';
    url  = encodeURI(url);  //"http://www.baidu.com?name=%E6%9D%8E%E5%9B%9B&sex=man"
    

  • encodeURIComponent()
    参数是一个字符串，它会将语义字符之外的字符都进行转义。通常只用它转URL的片段。

    var url = 'http://www.baidu.com?name=李四&sex=man';
    url  = encodeURIComponent(url);  //"http%3A%2F%2Fwww.baidu.com%3Fname%3D%E6%9D%8E%E5%9B%9B%26sex%3Dman"
    

• 解码方法
  有编码就肯定有解码。解码方法也是三种：
  unescape是escape方法的逆运算。
  decodeURI用于还原转义后的URL。它是encodeURI方法的逆运算。
  decodeURIComponent用于还原转义后的URL片段。它是encodeURIComponent方法的逆运算。

学习参考资料

阮一峰JS教程
关于URL编码