你所不知道的 URL

0.说明

第一幕

产品：大叔有用户反映账户不能绑定公众号。
大叔：啊咧咧？怎么可能，我看看？
大叔：恩？这也没问题啊，魏虾米。
大叔：还是没问题啊，挖叉类。
大叔：T T，话说产品姐姐是不是Java提供接口的时候，没有对URL进行encodeURI。
产品：啊咧咧？我问问看？

第二幕

大叔：翔逼你给我过来！
翔逼：啊咧咧？怎么了大叔？
大叔：知道在URL中的+有时候会变成什么吗？
翔逼：啊咧咧？不是+吗？
大叔：知道在URL中的空格有时候会变成什么吗？
翔逼：啊咧咧？不是空格吗？
大叔：还不赶快自己去查查看！别也成了挖坑型选手。

1.杀手兄弟 - 加号与空格

0.说明

维基百科中关于百分号编码中有段说明。

当HTML表单中的数据被提交时，表单的域名与值被编码并通过HTTP的GET或者POST方法甚至更古远的email把请求发送给服务器。这里的编码方法采用了一个非常早期的通用的URI百分号编码方法，并且有很多小的修改如新行规范化以及把空格符的编码"%20"替换为"+" . 按这套方法编码的数据的MIME类型是application/x-www-form-urlencoded, 当前仍用于（虽然非常过时了）HTML与XForms规范中. 此外，CGI规范包括了web服务器如何解码这类数据、利用这类数据的内容。

1.GET - 简单的在浏览器中测试

URL带有加号

在浏览器里输入URLhttps://www.baidu.com/s?wd=翔逼+大叔，这时候百度搜索框中出现的是翔逼大叔，搜索框中+神奇的变成了空格。

URL带有空格

在浏览器里输入URLhttps://www.baidu.com/s?wd=翔逼大叔，这时候百度搜索框中出现的是翔逼大叔，URL中空格的变成%20。

URL带有%2B

在浏览器里输入URLhttps://www.baidu.com/s?wd=翔逼%2B大叔，这时候百度搜索框中出现的是翔逼+大叔，搜索框中%2B的变成+。

2.POST - 简单的PHP测试

代码

<?php

echo $_POST['word'];

POSTMAN 发送请求

POST /1.php HTTP/1.1

Host: 127.0.0.1

Cache-Control: no-cache

Postman-Token: fed5740c-aceb-0f57-edc9-cf42a275b35a

Content-Type: application/x-www-form-urlencoded

word=%2B%2B%2B+%2B%2B%2B

输出

+++ +++

2.孕妇 - URL中的URL

0.说明

在社交登录或微信公众号等时候，我们常常会在URL中使用到回调地址来处理验证成功后的页面跳转。

例如:

回调地址为：lionis.taroball.com?username=lionis&sex=man
这时候在URL中附加回调信息时
地址变为www.xxx.com?redirect=lionis.taroball.com?username=lionis&sex=man。

这个时候尴尬的问题出现了，sex=man在这个时候变成了www.xxx.com的参数了，而不是lionis.taroball.com的参数了。

这个时候就需要对回调信息进行encodeURL。

2.代码

<?php

// 文件名为test.php

echo $_GET['redirect'];

3.有 encodeURL

URL

localhost/test.php?redirect=lionis.taroball.com%3Fusername%3Dlionis%26sex%3Dman

输出

lionis.taroball.com?username=lionis&sex=man

4.无 encodeURL

URL

localhost/test.php?redirect=lionis.taroball.com?username=lionis&sex=man

输出

lionis.taroball.com?username=lionis

3.结论

GET

如果想在URL中使用+需要对URL进行encodeURL,把+编码成%2B。
在服务端渲染页面的时候，对URL需要encodeURL。
在客户端发送请求的时候，javascript需要使用正则来进行替换。
在服务端接受参数的时候，对关键字使用decodeURL。
对于URL中的URL也需要进行encodeURL

POST

POST的Content-Type默认是application/x-www-form-urlencoded，顾名思义对URL进行了encodeURL。
想要了解更多有关POST可以看我之前写的你所不知道的POST。