资讯专栏INFORMATION COLUMN

JS 中 URL 编码的问题.

lanffy / 613人阅读

摘要:这些字符是普通字符编码解码的问题既然浏览器会默认给进行编码那么服务器就会默认给解码。

URL 编码 为什么要对 URL 编码

1. 避免解析错误

我们的 queryString 的形式是使用 ?开始, key=value 传递参数, key-value pairs 之间使用 & 连接.
比如:

?postid=5038412&t=1450591802326

服务器会

根据 & 解析 key-value pairs
根据 = 解析 key,value

那么如果 key或者 value 中存在 =,&, 那么就会解析挂掉,
比如 宝洁公司叫做 P&G

?name=P&G&t=123456

服务器解析的时候就会解析错误:

name=P
G     //到这里就挂掉了

2. 避免非法字符

URL 只能使用 ASCII 字符集, 所有的非 ASCII 码都算是非法字符.
在这个定义中, 所有的中文都算是非法字符.

URL 的编码规则

一般使用的是 百分号编码(percent-encoding)

规则:

是否是 ASCII 字符
    是
        取对应的字节编号, 比如 "a" 对应的是 "0x61", 那么编码之后就是 %61
    否
        使用 utf-8 对其进行编码
        比如"中文"使用UTF-8字符集得到的字节为 0xE4 0xB8 0xAD 0xE6 0x96 0x87,
        经过Url编码之后得到"%E4%B8%AD%E6%96%87".
实际情景

浏览器会默认给 URL 编码, 但是不同浏览器的编码实现方式不一致, 所以最好的方式就是:
我们自己通过 JS 对 URL 进行编码

JS 用来编码的函数有 3 个:

// escape()  // 不推荐使用, 原因不明.
encodeURI()
encodeURIComponent()

encodeURI 会对整个 URL 中的非法字符编码 (它是为了解决非法字符)
encodeURIComponent 会对所有的保留字都编码 (解决解析错误的问题)

所以最终的编码方式是:

对每一个 key-value 进行 encodeURIComponent 编码

对整个 URL 进行 encodeURI 编码

备注:
URL 中的字符可以分成三类:
保留字符 (reserved characters):
这类字符是URI中的保留关键字符,它们用于分割URI中的各个部分。
这些字符是: ;, /, ?, :, @, &, =, +, $, ,
Mark字符 (mark characters)
这类字符在RFC-2396中特别定义,但是没有特别说明用途,可能是和别的RFC标准相关。
这些字符是:-, _, ., !, ~, *, ", (, )
普通字符

URL 编码解码的问题
既然浏览器会默认给 URL 进行编码, 那么服务器就会默认给URL 解码。
如果我们仅仅是对 URL 进行 encodeURI, 那么服务器在解码的时候可以正常, 但是解析的时候依旧不能
区分 & 到底是分割符还是 value 中的一个普通字符, 所以我们需要对 key-value pairs 进行编码的.

最终结论
使用 encodeURIComponent 避免参数解析错误
使用 encodeURI 避免非法字符

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/83794.html

相关文章

  • 关于URL编码

    摘要:基本概念编码不能直接使用需要编码领杉果红包,享更多优惠点击领取问题的由来就是网址只要上网就一定会用到只有字母和数字一些特殊符号以及某些保留字才可以不经过编码直接用于这意味着如果中有汉字就必须编码后使用但是麻烦的是没有规定具体的编码方 基本概念 1.encodeComponent编码url,url不能直接使用,需要编码 var rlt = http://service.weibo.com...

    HitenDev 评论0 收藏0
  • 前端开发字符编码

    摘要:当然,也可自己写一个转换函数,按照一定规则便行为编码的字节,如下例中国结果中国结果结果通过简单的函数,就可以完成编码到编码的转换,进而完成宽字节字符到编码的转换。 前端开发过程中会接触各种各样的编码,比较常见的主要是 UTF-8 和 HTML 实体编码,但是 web 前端的世界却不止这两种编码,而且编码的选择也会造成一定的问题,如前后端开发过程中不同编码的兼容、多字节编码可能会造成的 ...

    Rindia 评论0 收藏0
  • 解决url请求参数带文时后台获取出现乱码问题

    摘要:在服务器端,首先通过自动进行第一次解码可能是等字符集对结果无影响得到字符,然后再使用进行第二次解码,通常使用方法。 第一种方法:var url = encodeURI(url);前端js先编码一次,后台:String test=newString(request.getParameter(test).getBytes(iso8859-1),UTF-8); 先解码还原成byte数组, 再...

    Fourierr 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<