确认过眼神，看清 HTTP 协议

导读：什么是 HTTP？它有什么属性？咱们经常使用的是什么呢？快来阅读本文，将会为你一一道来。

1、什么是 HTTP 协议？

在了解HTTP以前，咱们须要了解什么是网络通讯模型(也就是咱们常说的 OSI 模型)

1.1 OSI 模型

OSI 模型是对网络中数据是如何被传送和接收的一个具象化的展现，以下图展现

在 OSI 中咱们所处在最顶层，咱们全部的网络的行为，数据的传递都是从顶至下而后在从下至顶完成一次传递的。每一层都会有对应的一些协议，协议就比如是数据的 '通行证'，有些协议会把咱们的数据加密，让它更安全，有些协议帮助数据创建通道，指明去路。而咱们此次要说的 HTTP 协议属于应用层中的协议，它的主要做用就是传递资源，创建通道让咱们更加方便的去访问网络资源。资源必须是经过 URL 地址能够访问到的，包括但不限于图片，数据，文件等等。

2、HTTP属性

咱们已经知道了 HTTP 协议在 OSI 中的位置以及功能。那么如今咱们就来看看它神秘面纱下的样子吧。

2.1 HTTP结构

咱们称呼 HTTP 内容为报文，一个 HTTP 由请求报文和响应报文组成，最方便的报文查看就是浏览器开发者工具的 Network 这一项

以上是访问 hellogithub.com/ 后查看到的请求报文 (Request Headers) 和响应报文(Response Headers)。完整的请求就是客户端发送请求，服务器返回响应，关闭链接

请求和响应的格式长得差很少，它们都是由：

• 一条初始行
• 零或多条头信息
• 一个空行
• 一个可选的消息体组成的

那么如今让咱们进一步分析所展现的数据吧

3、General 内容展现的是通用头

Request Url: 请求地址 (目前资源所在的地址)

Request Method: 请求方法，请求方法是使用 HTTP 动词来对目标资源进行操做，经常使用的请求方法有以下7种

1. GET：用于请求访问已被url识别的资源，能够经过url传参给服务器
2. POST：用于传输信息给服务器
3. PUT：传输文件，报文体中包含文件内容，保存在对应的url位置
4. HEAD：得到报文首部，与GET方法类似，只是不返回报文主体，通常用于验证一个内容是否正常存在，或者url是否有效
5. OPTIONS：返回服务器可用的方法（请求方法）
6. TRACE：查看http协议有没被修改。
7. DELETE ：删除对应url位置的文件

Status Code: 状态码，不一样的状态码表明不一样状况，以下罗列一些经常使用状态码

• 1 开头的状态码表明信息响应
• 2 开头表示请求的成功，常见有：200
• 3 开头的状态吗表示重定向，常见有：304
• 4 开头的状态码表示客户端的响应，常见有：404( Not Found )
• 5 开头的状态码则表明服务端的响应，常见有：500( 服务器器遇到了问题 )

若是过须要了解详细 developer.mozilla.org/zh-CN/docs/…

Remote Address: 远程地址，这个地址表明的是服务器所在IP地址

Refer Policy: 这是用来监管哪些访问来源信息，no-referrer-when-downgrade (默认值)，意思是在没有指定任何策略的状况下用户代理的默认行为。在同等安全级别的状况下，引用页面的地址会被发送( HTTPS->HTTPS )，可是在降级的状况下不会被发送 ( HTTPS->HTTP )。

具体请查看—> developer.mozilla.org/zh-CN/docs/…

4、Response Headers(表明服务器的响应信息)

Connection：keep-alive，这个 header 表示客户端和服务器在一次请求和响应以后不要关闭链接

可是为何要使用这个头部呢？缘由是在早期的 HTTP 1.0中，每发出一个请求都要建立一个链接，可是建立链接的过程是一个损耗资源的过程，因此在后期的 HTTP/1.0 以及 HTTP/1.1 中引入了重用链接机制，须要添加该请求头，而在 HTTP/1.1 中已经默认是长链接了。

Content-Encoding：gzip，这个 header ****主要是设置数据压缩，在 Web 应用中咱们一般都要打开gzip压缩，这样使得咱们的数据体积更小，所占用的带宽也更小因此达到了性能优化的目的

Content-type：text/html; charset=utf-8，这个 header 代表了资源类型，由于咱们访问的是网页因此类型即是 text-html 而咱们设置的编码是 utf-8

Date：表示报文建立的日期

Server：nginx，这个 header 代表服务器类型，nginx 说明使用了代理服务器，也许并非应用真正的服务器类型

Set-Cookie: 被用来服务端向客户端设置 cookie

Strict-Transport-Security：这是一个安全设置，表示只有 HTTPS (一种加密的 HTTP 协议，一般能够代替第6层 OSI 模型的功能)才能访问

Transfer-Encoding：消息首部指明了将 entity 安全传递给用户所采用的编码形式。chunked表示数据以一系列分块的形式进行发送

5、Request Headers(表明客户端请求信息)

Accept: 请求头用来告知客户端能够处理的内容类型，这种内容类型用MIME类型来表示。借助内容协商机制, 服务器能够从诸多备选项中选择一项进行应用，并使用 Content-Type 应答头通知客户端它的选择

Accept-Encoding: 会将客户端可以理解的内容编码方式——一般是某种压缩算法——进行通知。经过内容协商的方式，服务端会选择一个客户端提议的方式，使用并在响应报文首部 Content-Encoding 中通知客户端该选择。

Accept-Language: 请求头容许客户端声明它能够理解的天然语言，以及优先选择的区域方言。

Cashe-Control: 设置缓存

Cookie: 客户端传递的 cookie

User-Agent: 代表客户端一些基本设备信息

6、结语

本文中咱们学习了 OSI 模型，知道了 HTTP 协议是在模型的那一层，知道了一个完整的HTTP请求是怎么样的，而后经过 Chrome DevTools 分析了一个完整的 HTTP 请求，咱们知道了经常使用的请求方法，经常使用的网络状态码，响应头以及请求头，还有一些经常使用到的 header。可是本文介绍的只是HTTP中的一小部分，还有不少有用的 header 等待咱们去发现，以及还有 HTTP 2.0 版本的激动人心的新特性。下面给你们安利一个经常使用网站 developer.mozilla.org/zh-CN/ （MDN）若是你是 Web 开发者千万不要错过，这个网站囊括了关于 Web 开发全路线教程。

最后祝愿你们天天早下班，代码无Bug，迎娶白富美，走向人生巅峰

公众号

HelloGitHub 连载三年，GitHub 上已经得到超过 1万颗 ⭐

关注公众号加入交流群，一块儿讨论有趣的技术话题。分享本文给你的朋友们吧！