前端为什么要对url进行编码

Posted 2020-10-08 奔跑的蜗牛

为什么要对url进行编码

• url有规范，在参数值中出现&字符会截断参数
• url中文的问题，编码客转换为英文
• 也是第一种情况，url中有个参数值是url，传输的时候会出现错误

例1

有这样一串参数: name1=value1&name2=value2

我们来说一下客户端到服务端的概念上解析过程, 上述字符串在计算机中用ASCII码表示为：

6E616D6531 3D 76616C756531 26 6E616D6532 3D 76616C756532
对应关系:
6E616D6531   -->  name1 
3D           -->  =
76616C756531 -->  value1 
26           -->  & 
6E616D6532   -->  name2 
3D           -->  = 
76616C756532 -->  value2 

　　服务端在接收到该数据后就可以遍历该字节流，首先一个字节一个字节的吃，当吃到3D这字节后，服务端就知道前面吃得字节表示一个key，再想后吃，如果遇到26，说明从刚才吃的3D到26子节之间的是上一个key的value，以此类推就可以解析出客户端传过来的参数。

现在有这样一个问题，如果我的参数值中就包含=或&这种特殊字符的时候该怎么办?

　　比如说“name1=value1”,其中value1的值是“va&lu=e1”字符串，那么实际在传输过程中就会变成这样“name1=va&lu=e1”。我们的本意是就只有一个键值对，但是服务端会解析成两个键值对，这样就产生了奇异。

如何解决上述问题带来的歧义呢？

解决的办法就是对参数进行URL编码

URL编码只是简单的在特殊字符的各个字节前加上%，例如，我们对上述会产生奇异的字符进行URL编码后结果：“name1=va%26lu%3D”，这样服务端会把紧跟在“%”后的字节当成普通的字节，就是不会把它当成各个参数或键值对的分隔符。

例2

一个接口,你传送过去时,需要带上你这边的回调地址,也是个url. 这样你不能url+url传送,需要一个urlencode把回调地址编码,防止发生问题
例如: 微信的一个接口

https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=REDIRECT_URI&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

REDIRECT_URI 这裡应该填你的服务器回调地址.正常写法如 http://api.baidu.com/callback.php

那么生成的接口就是

https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=http://api.baidu.com/callback.php&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

这样访问肯定出问题...
那么http://api.baidu.com/callback.php 这个回调地址, 就要转码后(encodeURIComponent)再放到地址中发送.

https://open.weixin.qq.com/connect/oauth2/authorize?appid=APPID&redirect_uri=http%3A%2F%2Fapi.baidu.com%2Fcallback.php&response_type=code&scope=SCOPE&state=STATE#wechat_redirect

 

文章参考: 

http://blog.csdn.net/chanda_yang/article/details/52422575

https://segmentfault.com/q/1010000002991580

https://www.zhihu.com/question/19673368