HTML GET传递空格变成了+是怎么回事？

本文将从多个方面对HTML GET传递空格变成了+这个现象进行详细阐述。

一、URL编码

在HTTP协议中，URL（Uniform Resource Locator，统一资源定位符）是用来表示互联网上资源的地址的一种标识方式。URL中的各个部分使用不同的字符集和编码方式，其中参数部分使用了URL编码。

URL编码是一种将URL中特殊字符或非ASCII字符转化成特定的格式的方法。转码后的字符会以%XX的形式表示，其中XX是该字符在ASCII码表中的值的16进制表示。空格字符（' '）在URL编码时会被转化成“+”号。

<form method="GET" action="http://example.com/search">
  <input type="text" name="q" value="Hello world">
  <input type="submit">
</form>

上述HTML代码中，name属性为“q”的元素的value值为“Hello world”。当该表单被提交到服务器时，浏览器会构造一个如下的GET请求：

GET http://example.com/search?q=Hello+world HTTP/1.1

浏览器将value值中的空格字符转化成了“+”号，并将参数名“q”和参数值“Hello+world”通过“？”符号连接到URL末尾，以便服务器端获取。

二、URL规范化

URL规范化的目的是消除URL中的冗余和歧义，提高识别和比较的准确性。在URL规范化中，空格字符会被替换为“%20”，而不是“+”号。

例如，下面是一个包含空格的URL：

http://example.com/path/to%20file.html?query=one+two

经过URL规范化后，该URL将变成：

http://example.com/path/to%20file.html?query=one%2Btwo

URL规范化是URL处理的一个重要步骤，可以提高URL的可读性和可维护性。

三、URL解码

与URL编码相对应的是URL解码。URL解码是一种将URL中被转码的特殊字符还原成其原先的字符的方法。在URL解码中，“+”号会被解码成空格字符。

例如，在下面的URL中，“+”号表示一个空格字符：

http://example.com/search?q=Hello+world

如果需要获取原始的value值，需要先对其进行URL解码：

var q = decodeURIComponent("Hello+world");

此时变量q的值为“Hello world”。

四、处理方法

由于浏览器对URL的处理方式可能有所不同，对于传递空格的情况，可以采用以下两种方法进行处理：

1、将空格字符手动转化成“%20”：

<form method="GET" action="http://example.com/search">
  <input type="text" name="q" value="Hello%20world">
  <input type="submit">
</form>

2、在接收方使用URL解码进行处理：

var q = decodeURIComponent("Hello+world");

根据实际情况选取合适的处理方式，可以避免由于传递空格而导致的问题。