（一）HTTP 请求过程

我们先来看下浏览器的请求过程：使用 Google 浏览器访问百度，打开调试界面，选择 Network
image.png
先观察第一个网络请求，即 www.baidu.com 其中各列的含义如下：

  • 第一列 Name：请求的名称，一般会将URL的最后一部分内容当做名称。
  • 第二列 Status：响应的状态码，这里显示是200，表示是正常的响应。
  • 第三列 Type：请求的文档类型，这里是 document，代表这次请求是一个 HTML文档，内容就是一些 HTML代码。
  • 第四列 Initiator：请求源。 用来标记请求是那个对象或进程发起的。
  • 第五列 Size：从服务器下载的文件和请求的资源大小，如果是从缓存中获得的资源，则该列会显示 from cache。
  • 第六列 Time：发起请求到获取响应所用的总时间。
  • 第七列 Waterfall：网络请求的可视化瀑布流。

（二）请求

请求，由客户端向服务器发出，可以分为4 部分内容：请求方法（Request Method）、请求的网址（Request URL）、请求头（Request Headers）、请求体（Request Body）。

（1）请求方法：

常见的请求方法有两种：GET 和 POST

GET 请求中的参数包含在URL里面，数据可以在URL中看到，而POST请求的URL不会包含这些数据，数据通过表单形式传输，会包含在请求体中。

GET请求提交的数据最多只有 1024 字节，而POST方式没有限制。

方法 描述
GET 请求页面，并返回页面内容
HEAD 类似于GET请求，只不过返回的响应包中没有具体的内容，用于获取包头。
POST 大多用于提交表单或上传文件，数据包含在请求体
PUT 从客户端向服务器传送的数据取代指定文档的内容
DELETE 请求服务器删除指定的页面
CONNECT 把服务器当成跳板，让服务器代理客户端访问网页
OPTIONS 允许客户端查看服务器的性能
TRACE 回显服务器收到的请求，主要用于测试或者诊断

（2） 请求的网址：

请求的网址，即统一资源定位符URL，它可以唯一确定我们想请求的资源。

（3）请求头：

请求头，用来说明服务器要使用的附加信息，比较重要的信息有 Cookie、Referer、User-Agent等。

Accept

  • 指定客户端能够接收的内容类型
  • Accept: text/plain, text/html

Accept-Charset

  • 浏览器可以接受的字符编码集
  • Accept-Charset: iso-8859-5

Accept-Encoding

  • 指定浏览器可以支持的web服务器返回内容压缩编码类型
  • Accept-Encoding: compress, gzip

Accept-Language

  • 浏览器可接受的语言
  • Accept-Language: en,zh

Authorization

  • HTTP授权的授权证书
  • Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Cache-Control

  • 指定请求和响应遵循的缓存机制
  • Cache-Control: no-cache

Connection

  • 表示是否需要持久连接 // HTTP 1.1默认进行持久连接
  • Connection: close

Cookie

  • HTTP请求发送时，会把保存在该请求域名下的所有cookie值一起发送给web服务器
  • Cookie: role=admin;ssid=1

Content-Length

  • 请求的内容长度
  • Content-Length: 348

Content-Type

  • 请求的与实体对应的MIME信息
  • Content-Type: application/x-www-form-urlencoded

Date

  • 请求发送的日期和时间
  • Date: Tue, 15 Nov 2010 08:12:31 GMT

Host

Referer

User-Agent

  • User-Agent的内容包含发出请求的用户信息
  • User-Agent: Mozilla/5.0 (Linux; X11)

（4）请求体：

请求体一般承载的 内容是 POST 请求中的表单数据，而对于GET请求，请求体则为空。

如下图，表示GET请求和POST请求。
GET 请求
image.png

POST请求
image.png
Content-Type 和POST 提交数据的关系：

Content-Type 提交数据的方式
application/x-www-form-urlencoded 表单数据
multipart/form-data 表单文件上传
application/ json 序列化 JSON 数据
text / json XML 数据

（三）响应

响应，由服务端返回给客户端，可以分为三个部分：响应状态码（response status code）、响应头（Response Headers） 和响应体（Responses Body）。

（1）响应状态码：

我们根据响应状态码来判断服务器的一个响应状态。

状态码 说明 详情
100 继续 请求者应当继续提出请求，服务器已收到请求的一部分，正在等待其余部分
101 切换协议 请求者已要求服务器切换协议，服务器已确认并准备切换
200 成功 服务器已成功处理了请求
201 已创建 请求成功并且服务器创建了新的资源
202 已接受 服务器已接收请求，但未处理
203 非授权信息 服务器已成功处理了请求，但返回的信息可能来自另一个源
204 无内容 服务器成功处理了请求，但没有返回任何内容
205 重置内容 服务器成功处理了请求，内容被重置
206 部分内容 服务器成功处理了部分内容
300 多种选择 针对请求，服务器可执行多种操作
301 永久移动 请求的网页已永久移动到新位置，即永久重定向
302 临时移动 请求的网页暂时跳转到其他页面，即暂时重定向
303 查看其他位置 如果原来的请求是POST，重定向目标文档应该通过GET提取
304 未修改 此次请求返回的网页未修改，继续使用上次的资源
305 使用代理 请求者应该使用代理访问网页
307 临时重定向 请求的资源临时从其他位置响应
400 错误请求 服务器无法解析该请求
401 未授权 请求没有进行身份验证或者验证未通过
403 禁止访问 服务器拒绝此请求
404 未找到 服务器找不到请求的网页
405 方法禁用 服务器禁用了请求的方法
406 不接受 无法使用请求的内容响应请求的网页
407 需要代理授权 请求者需要使用代理授权
408 请求超时 服务器请求超市
409 冲突 服务器在完成请求时冲突
410 已删除 请求的资源已永久删除
411 需要有效长度 服务器不接受不含有效长度标头字段的 请求
412 未满足前提条件 服务器未满足请求者在请求中设置的其中一个前提条件
413 请求实体过大 请求实体过大，超过服务器的处理能力
414 请求URL过长 请求网址过长，服务器无法处理
415 不支持类型 请求格式不被请求页面支持
416 请求范围不符 页面无法提供请求的范围
417 未满足期望值 服务器未满足期望请求标头字段的要求
500 服务器内部错误 服务器遇到错误，无法完成请求
501 未实现 服务器不具备完成请求的功能
502 错误网关 服务器作为网关或代理，从上游服务器收到无效响应
503 服务不可用 服务器目前无法使用
504 网关超时 服务器作为网关或代理，没有及时从上游服务器收到请求
505 HTTP版本不支持 服务器不支持请求所用的HTTP版本

（2）响应头

响应头包括服务器对请求的应答信息，如Content-Type、Server等等。

  • Accept-Ranges

表明服务器是否支持指定范围请求及哪种类型的分段请求
Accept-Ranges: bytes

  • Access-Control-Allow-Origin

配置有权限访问资源的域
Access-Control-Allow-Origin: |*

  • Allow

对某网络资源的有效的请求行为，不允许则返回405
Allow: GET, HEAD

  • Cache-Control

告诉所有的缓存机制是否可以缓存及哪种类型
Cache-Control: no-cache

  • Content-Encoding

web服务器支持的返回内容压缩编码类型。
Content-Encoding: gzip

  • Content-Language

响应体的语言
Content-Language: en,zh

  • Content-Length

响应体的长度
Content-Length: 348

  • Content-Location

请求资源可替代的备用的另一地址
Content-Location: /index.htm

  • Content-Type

返回内容的MIME类型
Content-Type: text/html; charset=utf-8

  • Date

原始服务器消息发出的时间
Date: Tue, 15 Nov 2010 08:12:31 GMT

  • ETag

请求变量的实体标签的当前值
ETag: “737060cd8c284d8af7ad3082f209582d”

  • Location

用来重定向接收方到非请求URL的位置来完成请求或标识新的资源
Location: http://www.zcmhi.com/archives/94.html

  • Proxy-Authenticate

它指出认证方案和可应用到代理的该URL上的参数
Proxy-Authenticate: Basic

  • Refresh

应用于重定向或一个新的资源被创造，在5秒之后重定向（由网景提出，被大部分浏览器支持）
Refresh: 5; url=http://www.zcmhi.com/archives/94.html

  • Server

web服务器软件名称
Server: Apache/1.3.27 (Unix) (Red-Hat/Linux)

  • Set-Cookie

设置Cookie，响应体中的 set-cookie 告诉浏览器需要将此内容放入在Cookie中，下次请求携带Cookie
设置Http Cookie Set-Cookie: UserID=JohnDoe; Max-Age=3600; Version=1

  • Strict-Transport-Security

设置浏览器强制使用HTTPS访问
max-age: x秒的时间内 访问对应域名都使用HTTPS请求
includeSubDomains: 网站的子域名也启用规则
Strict-Transport-Security: max-age=1000; includeSubDomains

  • X-XSS-Protection

配置XSS防护机制
X-XSS-Protection: 1; mode=block

  • HttpOnly：使 JavaScript 脚本无法获取 cookie，防止 xss 攻击。

  • X-Powered-By：可以知道 web 后端语言（但是可以修改）

（3）响应体

最重要的就是响应体的内容， 响应的正文都在响应体中，比如请求网页时，它的响应体就是网页的HTML代码。
image.png