HTTP协议(上)

HTTP是什么

1. HTTP协议处于TCP/IP五层协议栈的应用层。
2. HTTP在传输层是基于TCP的（HTTP/1，HTTP/2是基于TCP，HTTP/3是基于UDP）
3. 传输层协议，主要关注的是端对端之间的数据传输。TCP重点关注的是可靠传输。
4. HTTP应用场景：打开浏览器，随便打开一个网站，此时就用到了HTTP。

HTTP协议格式

UDP/TCP/IP这些协议属于“二进制”的协议，HTTP协议则是一个文本格式的协议。
如何才能看到这些HTTP的报文格式？
可以借助一些“抓包工具”来获取到具体的HTTP交互过程中请求和响应。

抓包工具，其实就是一个第三方程序。
在这个网络通信的过程中，类似于“代理”一样。

抓包工具的使用

1. 官网：https://www.telerik.com/fiddler
2. 选择Classic
   
   3.Fiddler的左侧，是一个列表，显示了当前抓到的所有的HTTP/HTTPS的数据报。

4 当选中左侧列表中的某个条目，并双击的时候，右侧就会显示这个条目的详细信息。
（1）上面是HTTP请求

• 标签页的选项，就表示了当前使用啥样的格式来显示HTTP请求。使用最多的就是Raw这个选项。（选择Raw看到的就是HTTP请求数据的本体，选择其他的选项，相当于Fiddler对数据进行了一些加工，调整了格式）

（2）下面是HTTP响应

• 针对响应，也有很多的选项，此处要选择Raw，才能看到本体。
  

如果看到的是乱码，这其实是压缩之后的结果。
一个服务器，最贵的是硬件资源，其实是网络带宽，像这些HTTP响应，经常会很大，就比较占带宽，为了提高效率，经常服务器会返回“压缩之后”的数据，由浏览器收到之后在解压缩。

注：

出现这种情况，是刚安装好的时候，默认没有启用HTTPS,如果抓到了HTTPS的包，就会出现类似的情况，当下网络上的大部分网站都是HTTPS，如果不开启HTTPS，其实基本没啥可抓的了。
如何开启？

在tools ->options里找到HTTPS选项，把相关的都勾上。


要点一：在勾选相关选项的时候，Fiddler可能会提醒，要安装xxx证书，一定要点是

要点二：Fiddler作为代理工具，是和其他的代理冲突的，如果电脑上安装了其他的代理程序/插件，就可能导致Fiddler失效。

协议格式总结

请求分为4个部分。

1.请求行（首行）。包含3个部分
（1）HTTP方法。方法大概描述了这个请求想干什么。get的意思就是想从服务器获取到某个东西。
（2）URL。描述了要访问的网络上的资源具体在哪
（3）版本号。HTTP/1.1表示当前使用的HTTP版本是1.1
2.请求头（header） 包含了很多行
每一行都是一个键值对。
3.空行
相当于请求头的结束标记。
4.请求正文
可选，不一定有。

使用Fiddler的一个小技巧：
在左侧的列表会一直持续的抓到新的结果，很快列表就会很大，可以进行清屏（选中一条记录，Ctrl+a全选，然后按delete删除）

响应分为4个部分。
1.状态行（首行）
（1）版本号
（2）状态码
描述了这个响应，是一个表示“成功的”还是“失败的”，以及不同的状态码，描述了失败的原因。
（3） OK 状态码的描述
通过一个/一组简单的单词，，来描述当前的状态码的含义。
2.响应头（header）
也是键值对结构，每个键值对占一行。
3.空行
表示响应头的结束标记
4.响应正文（body）
服务器返回给客户端的具体数据。
这里有不同的格式，最常见的格式是html。

HTTP请求(request)

认识URL

URL基本格式

URL 含义就是“网络上唯一资源的地址符”。

URL小结：
对于URL来说，里面的结构看起来比较复杂，其实最重要的包含4个部分
（1）IP地址/域名
（2）端口号（经常是小透明）
（3）带层次的结构路径
（4）查询字符串

URL encode/ decode

当query string 中包含了特殊字符，就需要对特殊字符进行转义，这个转义的过程叫做url encode ，反之，把转义后的内容还原回来，叫做url decode

url encode的规则，其实就是把要转义的内容的ASCII码的值取出来，用十六进制表示，同时加上%
例如：在搜狗中搜索c++，可以看到URL中的query string里面，有一个键值对，就表示了查询词的内容

认识方法(method)

,GET 和POST的区别：
GET和POST没有本质区别。具体来说，相当于是GET能使用的场景，也能替换成POST，POST使用的场景，也能替换成GET。
（1）GET通常用来取数据，POST通常用来上传数据.现状是GET也经常用来上传数据，POST也经常用来获取数据。
（2）通常情况下，GET没有body，GET通过query string向服务器传递数据；通常情况下，POST有body，POST通过body向服务器传递数据，但是POST没有query string。
（3）GET一般是幂等的，POST一般是不幂等的。

幂等：每次相同的输入，得到的输出结果是确定的
不幂等：每次相同的输入，得到的结果不确定

（4）GET可以被缓存，POST不能被缓存。

提前把结果记住。如果设计幂等的，记住结果是很有用的，节省了下次访问的开销，如果不是幂等的，就不应该记住。

典型的错误：GET请求传递的数据长度是有上限的，POST没有上限。

认识请求“报头”（header）

header里面是一些键值对，不同的键值对表示了不同的含义

host

表示服务器主机的地址和端口

Content-Length、Content-Type

Content-Length：表示 body 中的数据长度.
Content-Type：表示请求的 body 中的数据格式

这两个属性是在描述body，如果请求就没有body（GET），也就不需要这两个字段了。
一般POST都是带body的，一般登录是基于POST来实现的。

为啥登录是用POST实现？使用GET可以实现登录吗？
可以使用GET实现登录功能的。
为啥主要使用POST？
登录肯定要向服务器传递用户名和密码，如果是GET，用户名和密码习惯会放到URL的query string中来传递，此时浏览器的地址栏里的路径，就会变得很长一串，用户体验就会不是那么好。
POST数据放在body中，用户是不能直接看到的，body里放的内容的对用户的影响是非常小的。
典型错误说法：POST比GET更安全

常见的Content_Type中的数据格式

• application/x-www-form-urlencoded: form 表单提交的数据格式
• multipart/form-data: form 表单提交的数据格式(在 form 标签中加上
• application/json: 数据为 json

🎄关于Content-Length的补充
HTTP也是基于TCP的协议，TCP是一个面向字节流的协议，可能会出现粘包问题，因此需要合理的设计应用层协议来明确包和包之间的边界。（使用分隔符、使用长度）
如果当前有若干个GET请求，到了TCP接收缓冲区，应用程序读取请求的时候，就以空行为分隔符。
如果当前有若干个POST请求，到了TCP缓冲区，这个时候，空行后面还有body，当应用层程序读到空行之后，就需要按照Content-Length标明的长度，继续读取若干长度的数据。

User-Agent

表示的是当前用户是在拿啥样的东西来上网。

Referer

表示了当前的页面是从哪个页面跳转过来的（Referer不是一定有的，如果是通过浏览器地址栏直接输入地址，或者点击收藏夹，此时就没有Referer）

Cookie

浏览器为了安全，默认情况下是不能让页面的JS访问到用户电脑上的文件系统的，假设某个网页上，包含恶意代码，不小心点击，就可能会触发这个恶意代码，会删除电脑上的资料。
但是这样的安全机制，也带来了一些麻烦，有时候，确实需要让页面持久化存储一些数据，方便后续访问网站。其中，最典型的就是存储用户当前的身份信息。当用户在登录页面完成身份认证之后，此时服务器就会给浏览器返回一个用户的身份信息，浏览器把这个信息就保存到了一个特定的位置上，后续在访问同一个网站的其他页面的时候，浏览器在自动的带上这个身份信息，服务器就能识别了。
虽然不能让页面的JS访问整个磁盘数据，但是可以单独给浏览器分配一个空间（这个空间，有不同的形式，其中Cookie是一个比较经典的形式）

1. Cookie就是浏览器给页面提供的一种能够持久化存储数据的机制。

2. Cookie的组织形式
   （1）先按照域名来组织，针对每个域名，分别分配一个空间
   （2）一个空间里，又会按照键值对的方式来组织数据

3. Cookie数据从哪里来？
   其实是服务器返回给客户端的
   

Cookie就相当于看病时的就诊卡，虽然就诊卡上面可以存储一些信息，但是保存的信息是有限的，真正保存信息的并不是就诊卡，而是在医院的服务器上（存储在服务器上，称为“session”），而就诊卡，只是存储一个身份标识(存用户id)。
服务器这里管理着很多的session，每个session里面都存储了用户的关键信息，每个session也有一个sessionid（会话的标识），就诊卡其实存储的是这个会话id。

小结：Cookie是浏览器提供的一个持久化存储数据的机制，Cookie最重要的应用场景，就是存储会话id，进一步的让访问服务器的后续页面的时候，能够带上这个id从而让服务器能够知道当前的用户信息

认识请求正文（body）

正文中的内容格式和 header 中的 Content-Type 密切相关。

1. application/x-www-form-urlencoded
   格式和query string 是一样的，也是键值对的结构，键值对之间使用&来分割，键和值之间使用=分割，并且需要urlencode
2. multipart/form-data
   上传文件
3. application/json
   {}构成的若干个键值对，键和值之间使用：分割，键值对之间使用逗号分割。

HTTP响应

认识状态码

状态码表示这次请求是成功还是失败

200 OK

浏览器很成功的就获取到想要的内容。

404 Not Found

要访问的资源不存在.

403 Forbidden

虽然资源有，但是没有权限使用。

405 Method Not Allowed

这个情况，很难遇到。
例如：尝试使用GET来访问服务器，但是可能只支持POST，于是就会返回405

500 Internal Server Error

服务器出现内部错误. 一般是服务器的代码执行过程中遇到了一些特殊情况(服务器异常崩溃)会产生这个状态码。

504 Gateway Timeout

当服务器负载比较大的时候, 服务器处理单条请求的时候消耗的时间就会很长, 就可能会导致出现超时的情况。

302 Move temporarily

重定向

就相当于手机号码中的 “呼叫转移” 功能.
比如我本来的手机号是 111, 后来换了个新号码 222, 那么不需要让我的朋友知道新号码,
只要我去办理一个呼叫转移业务, 其他人拨打 111 , 就会自动转移到 222上。

典型的场景：登录过程中

location就描述了接下来要跳转到哪里（在重定向响应中，一般都是需要location属性的）

状态码以2开头的，属于成功
以3开头的，属于重定向
以4开头的，属于客户端出现错误
以5开头，属于服务器出现错误
特殊的状态码：418 虽然在搜狗百科中没有，但是确实存在于HTTP标准文档中。（彩蛋）

认识响应“报头”

响应中的 Content-Type 常见取值有以下几种

1. text/html : body 数据格式是 HTML
2. text/css : body 数据格式是 CSS
3. application/javascript : body 数据格式是 JavaScript
4. application/json : body 数据格式是 JSON

正文

里面的格式非常灵活，取决于响应头中的Content-Type
（1）html
（2）CSS
（3）js
（4）json