HTTP协议

第1章 - HTTP协议简介

1.1 - HTTP协议是什么（9层）

☛协议:是指计算机通信网络中两台计算机之间进行通信所必须共同遵守的规定或规则。

☛HTTP（hypertext transport protocol）协议也叫超文本传输协议，是一种基于TCP/IP的应用层通信协议，这个协议详细规定了浏览器和万维网服务器之间互相通信的规则。

客户端与服务端通信时传输的内容我们称之为报文。

☛HTTP就是一个通信规则，这个规则规定了客户端发送给服务器的报文格式，也规定了服务器发送给客户端的报文格式。实际我们要学习的就是这两种报文。客户端发送给服务器的称为“请求报文”，服务器发送给客户端的称为“响应报文”。

1.2 - Fiddler

1.2.1 - 简介

Fiddler是一个http协议调试代理工具，使用它我们可以抓取网页的所有请求与响应，也就是咱们俗称的抓包。

1.2.2 - 安装

1.2.3 - 使用

当你打开fiddler工具时，它就会自动抓取浏览器的数据包。

如何查看报文呢？

如何停止自动抓包呢？
点击左下角的capturing，当它消失时会停止抓包。再次点击时它会出现，开始自动抓包。

1.3 - 报文

1.3.1 - 报文格式

1.3.2 - 请求报文

1. 报文格式

请求首行；
请求头信息；
空行；
请求体；

2. GET请求

GET http://localhost:3000/index.html?username=sunwukong&password=123123 HTTP/1.1
Host: localhost:3000
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Upgrade-Insecure-Requests: 1
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9

下面分析一下：报文中常见的：

• 1)GET http://localhost:3000/hello.html HTTP/1.1：GET请求，请求服务器路径为http://localhost:3000/hello.html，?后面跟着的是请求参数（查询字符串），协议是HTTP 1.1版本
• 2)Host: localhost:3000：请求的主机名为localhost，端口号3000
• 3)Connection: keep-alive：处理完这次请求后继续保持连接，默认为3000ms
• 4)Pragma: no-cache：不缓存该资源，http 1.0的规定
• 5)Cache-Control: no-cache： 不缓存该资源 http 1.1的规定，优先级更高
• 6)Upgrade-Insecure-Requests: 1：告诉服务器，支持发请求的时候不用http而用https
• 7)User-Agent: Mozilla/5.0 (…：与浏览器和OS相关的信息。有些网站会显示用户的系统版本和浏览器版本信息，这都是通过获取User-Agent头信息而来的
• 8)Accept: text/html,…：告诉服务器，当前客户端可以接收的文档类型。q 相当于描述了客户端对于某种媒体类型的喜好系数，该值的范围是 0-1。默认为1
• 9)Accept-Encoding: gzip, deflate, br：支持的压缩格式。数据在网络上传递时，可能服务器会把数据压缩后再发送
• 10)Accept-Language: zh-CN,zh;q=0.9：当前客户端支持的语言，可以在浏览器的工具选项中找到语言相关信息`

3 - POST请求

POST请求要求将form标签的method的属性设置为post

POST请求是可以有请求体的，而GET请求没有请求体

POST http://localhost:3000/index.html HTTP/1.1
Host: localhost:3000
Connection: keep-alive
Content-Length: 34
Pragma: no-cache
Cache-Control: no-cache
Origin: http://localhost:3000
Upgrade-Insecure-Requests: 1
Content-Type: application/x-www-form-urlencoded
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Referer: http://localhost:3000/form.html
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9
Cookie: Webstorm-129da853=8726c2d8-3b88-48b8-8db0-dd82e62fb79a

username=sunwukong&password=123123

• 1)Origin: http://localhost:3000：请求来源于 http://localhost:3000
• 2)Content-Type: application/x-www-form-urlencoded：提交数据的方式
• 3)Cookie: Webstorm…：cookie信息
• 4)username=sunwukong&password=123123：请求体内容！对应form表单输入的内容

1.3.3 - 响应报文

1. 报文格式

响应首行；
响应头信息；
空行；
响应体；

2 - 报文分析

HTTP/1.1 200 OK
X-Powered-By: Express
Accept-Ranges: bytes
Cache-Control: public, max-age=0
Last-Modified: Wed, 21 Mar 2018 13:13:13 GMT
ETag: W/"a9-16248b12b64"
Content-Type: text/html; charset=UTF-8
Content-Length: 169
Date: Thu, 22 Mar 2018 12:58:41 GMT
Connection: keep-alive




  
  


  
这是我的第一个服务器

• 1)HTTP/1.1 200 OK：协议是HTTP 1.1版本，请求响应成功
• 2)X-Powered-By: Express：自定义的头，表示用的框架，一般不返回容易造成安全漏洞。
• 3)Accept-Ranges: bytes：告诉浏览器我支持多线程下载
• 4)Cache-Control: public, max-age=0：强制对所有静态资产进行缓存，即使它通常不可缓存。max-age指定多久缓存一次
• 5)Last-Modified: Wed, 21 Mar 2018 13:13:13 GMT：这个资源最后一次被修改的日期和时间
• 6)ETag: W/“a9-16248b12b64”：请求资源的标记/ID
• 7)Content-Type: text/html; charset=UTF-8：返回响应体资源类型
• 8)Content-Length: 169：响应体的长度
• 9)Date: Thu, 22 Mar 2018 12:58:41 GMT：提供了日期的时间标志，说明响应报文是什么时间创建的

3 - 响应状态码

响应码对浏览器来说很重要，它告诉浏览器响应的结果。

• 1)200：请求成功，浏览器会把响应体内容（通常是html）显示在浏览器中；
• 2)301：重定向，被请求的旧资源永久移除了（不可以访问了），将会跳转到一个新资源，搜索引擎在抓取新内容的同时也将旧的网址替换为重定向之后的网址；
• 3)302：重定向，被请求的旧资源还在（仍然可以访问），但会临时跳转到一个新资源，搜索引擎会抓取新的内容而保存旧的网址；
• 4)304：请求资源未被修改，浏览器将会读取缓存；
• 5)404：请求的资源没有找到，说明客户端错误的请求了不存在的资源；
• 6)500：请求资源找到了，但服务器内部出现了错误；

1.4 - get和post区别

• 1)GET使用URL或Cookie传参，而POST将数据放在BODY中。
• 2)GET方式提交的数据有长度限制，则POST的数据则可以非常大。
• 3)POST比GET相对安全，因为数据在地址栏上不可见。

1.4.1 常见的get请求

• 1)url地址栏发送请求
• 2)点击a标签发送请求
• 3)Form表单没有填写（method: post）时发送的请求

1.4.2 常见的post请求

• Form表单method: post时发送的请求