目录
前言
本篇博客主要介绍如何抓包、介绍HTTP的报文的格式和如何构造一个HTTP请求。
一、HTTP是什么
1.1 HTTP概念介绍
HTTP (全称为 "超文本传输协议") 是一种应用非常广泛的应用层协议.
HTTP 往往是基于传输层的 TCP 协议实现的. (HTTP1.0, HTTP1.1, HTTP2.0 均为TCP, HTTP3 基于 UDP 实现) 目前我们主要使用的还是 HTTP1.1 和 HTTP2.0 ，我们平时打开一个网站, 就是通过 HTTP 协议来传输数据的.
所谓 "超文本" 的含义, 就是传输的内容不仅仅是文本(比如 html, css 这个就是文本), 还可以是一些 其他的资源, 比如图片, 视频, 音频等二进制的数据.
1.2 HTTP协议工作过程
当我们在浏览器中输入一个搜狗搜索的 "网址" (URL) 时, 浏览器就给搜狗的服务器发送了一个 HTTP 请 求, 搜狗的服务器返回了一个 HTTP 响应. 这个响应结果被浏览器解析之后, 就展示成我们看到的页面内容. (这个过程中浏览器可能会给服务器发送 多个 HTTP 请求, 服务器会对应返回多个响应, 这些响应里就包含了页面 HTML, CSS, JavaScript, 图片, 字 体等信息).
HTTP协议是一个一问一答的这种形式的协议，客户端发送一个请求就会对应的返回一个响应。
二、抓包工具的使用
抓包工具是什么：抓包工具就可以理解为是一个代理，借助这个代理就可以看到网络上具体传输的数据了。可以便于分析网络通信和排查问题。
抓包工具我们这里介绍的是fiddler，fiddler可以直接去官网下载；
下载地址：Fiddler | Web Debugging Proxy and Troubleshooting Solutions (telerik.com)
fiddler进入之后需要进行一个简单的配置，因为默认是只能抓取HTTP协议的包，但是网络上基本都是HTTPS协议的，因此需要我们配置成可以抓取HTTTPS的包。
只需要根据一下步骤配置一下就可以了：
点开步骤三之后需要将下面的全都勾选上，勾选上过程中如果出现对话框，一般是询问是否安装根证书，一定得选是，否则就得卸载重装了。
配置完就如下图所示 ：
如何快速找到自己需要的包：
首先要抓包之前可以先选中任意一个包，接着ctrl+A全选，再按delete删除，不然包太多了，会干扰到我们。
当我们需要的包出现时，就可以暂停抓包了，因为这个即使我们不操作，也会有别的程序会自己去发送各种各样的请求，因此继续抓包的话包会越来越多，不利于抓我们需要的包。
一般我们可以根据颜色来区分：黑色的一般是普通数据包，蓝色的是html包，紫色的是响应内容是CSS文件，绿色的是响应内容是Script文件，灰色的是数据流类型CONNECT或响应内容是图片,黄色的是HTTP状态需用户认证，红色的则是HTTP状态错误 。接下来可以看url，也就是域名，最后还可以看看响应的数据长度，一般我们找的都是比较长的。
在fiddler中抓到的包上面是请求，下面是响应；
如何查看抓到的包的内容：点击Raw之后，如果字体太小可以点击右下角的View in Notepad到记事本中查看。
三、HTTP的报文格式
一般请求和响应的报文格式：包括四个部分：请求行、请求报头、空行(header的结束标记)、请求正文。
此处空行的用处： 因为 HTTP 协议并没有规定报头部分的键值对有多少个. 空行就相当于是 "报头的结束标记", 或者 是 "报头和正文之间的分隔符". HTTP 在传输层依赖 TCP 协议, TCP 是面向字节流的. 如果没有这个空行, 就会出现 "粘包问题".
HTTP请求
我们以上的抓包就是为了来研究HTTP的报文格式。接下来就来详细介绍一下HTTP请求：
首先我们先抓个包来作为例子分析一下：以下是我在浏览器中输入搜狗网站之后的一个请求报文：
接着是一个教务系统的登录的post请求报文：
首行：
HTTP方法：描述了HTTP请求想要干什么，HTTP协议有很多种方法，不同的方法，表示不同的"语义",POST一般是表示提交数据的请求，一般出现在登录或者上传文件的时候就会出现。
一个经典的面试题：POST和GET的区别：首先明确，没有本质的区别，GET和POST语义上有区别，只是便于区分，并不是强制要求遵守的。但是一般要遵守。
本质山没区别，但是使用习惯上有区别：1.GET习惯上用来获取一个数据，POST用来提交一个数据。2.GET一般不能没有body，携带数据则放到url中，post一般有body。3.GET请求通常会设计成幂等，post则没要求。4.GET是可缓存的(前提是幂等)，POST则不能。5.GET请求可以被浏览器收藏，POST则不能。
幂等的概念：幂等是一个数学上的概念，指的是可以使用相同参数重复执行，并能获得相同结果的函数，在编程中一个幂等操作的特点是其任意多次执行所产生的影响均与一次执行的影响相同。就是指当输入一定时，输出也是一定的。
URL：这是一个唯一资源定位符，描述的是网络上的唯一一个资源。url不止应用于http协议中，例如jdbc等等中都会有url。
URL格式解析：以下是我在edge浏览器中输入gitee回车后的结果
HTTP版本号：有http1.0，http1.1，http2，http3，现在主流的还是http1.1。
请求头(header)：
Host:大多数情况下，host和url的值会是一样的，但是当我们不是直接访问服务器而是通过“代理”来访问时，host和url就会是不一样的，这时候的host指的是最终目标，而url则是指当前目标。
Content-Length和Content-type:这两个属性一般是跟着body出现的，没有body就没有这两个属性，其中Content-Length描述的是body长度(单位是字节)，Content-type描述的是body的数据格式；
Content-type的几种常见写法：作为请求一般就两种，而作为响应种类则比较多：
json格式介绍：json格式使用{}表示，{}内部是一些键值对，键和值之间使用:(冒号)分割，键值对之间使用,(逗号)分割。(上面图片post请求中的body就是json格式)
User-Agent(UA)：这个属性是描述了客户端使用的设备操作系统和浏览器是什么版本型号。
Referer：这个属性比较简单，表示的是当前网页是从哪个页面跳转过来的；
cookie(重要)：本质是浏览器在本地存储用户自定义数据的一种关键机制，最典型的是存储用户的身份信息；那浏览器是怎么存储数据的呢？浏览器的数据其实是存储在硬盘上的，但是浏览器是禁止直接访问硬盘的，因此浏览器提供了Cookie机制，数据可以使用浏览器提供的api写入特定的文件中。这些文件是以域名为单位的，每一个网站都会有一个属于自己的Cookie文件。
cookie从哪来：cookie是从浏览器返回的，当我们给浏览器发送一个HTTP请求时，HTTP会提供set-cookie字段返回cookie，浏览器就会在计算机上存储下这个cookie；
cookie到哪里去：cookie会在下一次客户端发送请求时携带上发送给服务器，客户端只是暂存cookie，cookie的作用一般只在服务器端有用；
cookie有什么用：cookie是浏览器在本地存储数据的机制，存的数据不一定得是用户信息，也可以是别的数据，前提是数据得是字符串，但是cookie的典型应用就是存储用户信息，因此当用户发送请求时携带上浏览器cookie，服务器就可以根据cookie来区分用户了。这也是我们网站只需要登录一次之后就不需要一直重复登录了才能进行一些操作了，这都是因为此时浏览器已经记住了我们的身份信息了。这个cookie就相当于是我们日常生活看病用到的就诊卡。里面就记录用户的个人信息。
删除浏览器存储的cookie的方法(删除之后很多应用就都得重新登录了)：以edge浏览器为例
HTTP响应
以下图片是在浏览器地址栏输入搜狗域名之后的响应报文：
响应的构成和请求类似，也是由首行，响应头，空行，body(请求正文)。
状态码：
状态码是在首行出现的，状态码的意义就是为了告诉我们这一次的响应是成功还是失败，有没有哪里出现问题。
常见的状态码：
200：OK(表示成功)； 404：Not Found(找不到页面)；
403 Forbidden(表示拒绝访问)； 405 Method Not Allowed(表示方法不被允许)；
500 Internal Server Error(服务器内部错误)； 504 Gateway Timeout(表示请求超时)
301 Moved Permanently(永久重定向) 302 Move temporarily(临时重定向)
重定向的含义：
重定向类似于呼叫转移，比如原本我号码是123456，但是我号码换成了666666，这时候我可以选择一个一个通知朋友我换了新号码，也可以去营业厅办理呼叫转移业务，只要有人再打123456的号码，就会自动转移到666666号码上；重定位也是类似，我们点进去一个网页，网页如果换了地址，就会自动跳转到新的地址去了。这个在响应报文的 header 部分会包含一个 Location 字段, 表示要跳转到哪个页面。
更多状态码可以去MDN上查看：HTTP 响应状态码 - HTTP | MDN (mozilla.org)
响应报文的header和请求报文的header类似，这里就不在介绍了。
构造HTTP请求
其实http请求我们在不知不觉中也经常在构造，比如在浏览器地址栏输入一个URL就会构造出一个GET请求，在HTML中的a标签、link标签、img标签、script标签都会触发GET请求。接下去我们主要介绍使用form表单和ajax如何构造一个http请求。
构造form表单请求：
form表单只能构造简单的get和post请求
构造get请求的对应关系：
构造post请求的对应关系：
ajax构造请求：
从前端角度, 除了浏览器地址栏能构造 GET 请求, form 表单能构造 GET 和 POST 之外, 还可以通过 ajax 的方式来构造 HTTP 请求. 并且功能更强大，可以构造的请求种类更多，构造更加灵活
ajax 全称 Asynchronous Javascript And XML, 是 2005 年提出的一种 JavaScript 给服务器发送 HTTP 请求的方式。
使用ajjx构造请求首先要引入jquery，接着就可以根据自己的需求来构造了；
对于上述代码的一些解释：success中的函数这是一个回调函数，会在服务器返回一个正确响应的时候，被浏览器自动执行，这个过程是"异步"的。上述的过程也就是在我们把请求发出去之后就不管了，就继续执行接下去的代码，直到浏览器把响应返回给我们了，浏览器会自动执行success这个回调函数。
什么是同步和异步：在IO的场景中,同步是指请求的发起者自己获取响应，异步是指请求的发起者不关心响应，而是被请求的这一方计算出响应之后把响应自动的推给请求的发起者。
上述代码存在的问题：上述代码其实是无法运行的，因为ajax本身存在一个非常典型的问题，就是跨域问题。也就是这里的ajax的访问和域名和运行ajax代码的页面的域名是不一样的。这个问题不是bug而是浏览器为了安全问题而引入的保护机制。这个需要等到后面有了服务器，自己页面访问自己服务器就不会有跨域问题了。
使用postman构造请求：
上面我们使用的form表单和ajax构造的http请求都是需要我们自己写代码的。而接下来要介绍的postman就是一种不需要我们自己写代码就可以构造http请求的程序；
以下是postman最基本的使用：
316
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
