form表单的GET和POST请求

---

是HTML标签中比较复杂的标签之一，在学习中我注意到它与HTTP协议有关联，所以我做了一些总结。

---

method="GET"

• 首先新建一个包含form表单的html文件，例如index.html:

 





你好，这是form构造get请求


  


 

• 运行index.html，输入相应内容，点击提交按钮，用开发者工具观察页面发出的请求：

get请求.PNG

通过看当前页面的请求我们可以知道form表单构造的get请求内容：

1. action属性可以设定新页面的请求路径，也就是Request URL中的xxx
2. Request URL中出现了查询参数：？username=111&password=abc
3. 设定input中的name和value，点击提交时会构造一个新的get请求。

另外，form表单还有一个默认动作，如果

里有一个type="submit"的按钮(input/button)，则在任意一个input里按回车就可以提交表单，构造请求。

---

method="POST"

• 首先新建一个包含form表单的html文件，例如index.html:

 





你好，这是form构造post请求


  


 

• 运行index.html，输入相应内容，点击提交按钮，用开发者工具观察页面发出的请求：

post请求.PNG

通过看当前页面的请求我们可以看到form表单构造的post请求内容：

1. Request URL无查询参数
2. 查询参数在消息体内（在chrome里Form Data是请求的第四部分—消息体）
3. form的post请求有消息体

---

form表单GET请求和POST请求的区别

表象上的区别：

1. get无消息体
2. post一般没有查询参数
3. get有URL长度限制。由于get有查询参数，如果get的url超过服务器设置的范围，会得到414错误。
4. 安全性。post比get安全。因为构造post请求比get请求难。

---

个人见解：

get和post只有语义上的区别，get代表获取内容，post代表上传内容。
其实get也可以有消息体，只是由于它是去拿内容，没必要携带自身的信息。post也可以有查询参数（在action属性里加）。get/post都有长度限制，长度限制由服务器设置，可以改写。get和post都不安全，如果要安全，需要用http或者客户端的技术。