HTTP 使用指南

0x1 初识 HTTP 协议

网页加载流程

graph LR
A(user 输入网址)==>B(browser 进程)
B==>C(处理输入信息)
B-->D(页面加载完成)
C==>E(浏览器内核)
E==>F(发起请求)
F==>I(Internet)
I==>J(服务器)
J==>I
E-->G(读取响应)
E-->H(渲染)
F-->G
I==>G
G==>H
H==>D

HTTP 位于 OSI 模型和 TCP/IP 的应用层(Application)

什么是 HTTP

超文本传输协议：Hyper Text Transfer Protocol
作为应用层协议，基于传输层的 TCP

分为请求和响应两种模式

请求

POST /index.php HTTP/1.1

HOST: www.example.com

Content-Type: application/json

Content-Length: 15

{"msg": "hello,world"}

响应

HTTP/1.1 200 OK

Data: Sun, 1, Jan 2022 00:00:00

server: Tengine

content-type: text/html; charset=utf-8

<!doctype html><html><...

具有简单可扩展的特点
是一种无状态的协议：每个请求孤立

0x2 协议分析

发展历程

graph LR
A(HTTP/0.9 单行协议)-->B(HTTP/1.0 构建可扩展性)
B-->C(HTTP/1.1 标准化协议)
C-->D(HTTP/2 更优异的表现)
D-->E(HTTP/3 草案)

报文分析

请求 Requests

POST /index.php HTTP/1.1

HOST: www.example.com

Content-Type: application/json

Content-Length: 15

{"msg": "hello,world"}

响应 Responses

HTTP/1.1 200 OK

Data: Sun, 1, Jan 2022 00:00:00

server: Tengine

content-type: text/html; charset=utf-8

<!doctype html><html><...

HTTP/1.1 报文结构：

graph LR
A(start-line)-->B(HTTP headers)
A-->E(请求: Method Path Version)
A-->F(响应: Version StatusCode StatusMessage)
B-->C(empty line)
C-->D(body)

Method：请求方法

Method	描述	特点
GET	请求一个指定资源的表示形式	Safe、Idempotent
POST	用于将实体提交到指定的资源
PUT	用请求有效载荷替换目标资源的所有当前表示	Idempotent
DELETE	删除指定的资源	Idempotent
HEAD	请求一个与 GET 请求的响应相同的响应，但没有响应体	Safe、Idempotent
CONNECT	建立一个到由目标资源标识的服务器的隧道
OPTIONS	用于描述目标资源的通信选项	Safe、Idempotent
TRACE	沿着到目标资源的路径执行一个消息环回测试
PATCH	用于对资源应用部分的修改

Safe：安全，不会修改服务器的数据的方法
Idempotent：幂等，同样的请求被执行一次与连续多次的效果相同、服务器状态相同

Path：请求资源路径
Version：使用的 HTTP 版本
StatusCode：状态码
- 1xx：已接收，正在处理
- 2xx：成功（200：请求成功）
- 3xx：重定向，完成请求需要进一步操作（302：临时跳转）
- 4xx：客户端错误（404：资源不存在）
- 5xx：服务器端错误（504：网关超时）
- 详解
StatusMessage：状态信息
RESTful API：一种 API 设计风格（Representational State Transfer）
- 每个 URI 代表一种资源
- 客户端与服务器之间传递这种专业的某种表现层
- 客户端通过 Method 对服务器端资源进行操作，实现表现层状态转化

常用请求头

请求头	描述
Accept	接收类型，表示浏览器支持的 MIME 类型
Content-Type	客户端发送出去实体内容的类型
Cache-Control	指定请求和响应遵循的缓存机制
If-Modified-Since	对应服务端的 Last-Modified，用来匹配看文件是否变动
Expires	缓存，在这个时间内不会请求，直接使用缓存，服务端时间
Max-age	代表资源在本地缓存多少秒，有效时间内不会请求，而是使用缓存
If-None-Match	对应服务端的 ETag，用来匹配文件内容是否改变
Cookie	有 cookie 并且同域访问时会自动带上
Referer	该页面的来源 URL
Origin	最初的请求发起的源头（端口）
User-Agent	用户客户端的一些必要信息

常用响应头

响应头	描述
Content-Type	服务端返回的实体内容的类型
Cache-Control	指定请求和响应遵循的缓存机制
Last-Modified	请求资源的最后修改时间
Expires	应该在什么时候认为文档已经过期
Max-age	客户端的本地资源应该缓存时间（开启 Cache-Control 后有效）
ETag	资源的特定版本的标识符
Set-Cookie	设置和页面关联的 Cookie，服务器通过这个头部把 Cookie 传给客户端
Server	服务器的一些相关信息
Access-Control-Allow-Origin	服务器端允许的请求 Origin 头部

缓存：强缓存、协商缓存

graph LR
A(开始)-->B(浏览器)
B-->C(发起 GET 请求)
D(读取浏览器缓存)--将缓存返回浏览器-->C
C-->E{是否有缓存}
E--是-->F{强缓存是否新鲜}
F--是-->D
F--否-->G(上一次响应头是否有 ETag)
G--是-->H(发起请求, 请求头带 If-None-Match)
G--否-->I{上一次响应头是否有 Last-Modified}
I-->J(发起请求, 请求头带 If-Modified-Since)
H-->K{状态是否为 304}
J-->K
K--304-->D
K--200-->L(请求响应完成)
L-->M(协商缓存)

Set-Cookie-response	描述
Name=value	各种 cookie 的名称和值
Expires=Date	有效期，缺省时仅在浏览器关闭前有效
Path=Path	限制指定 cookie 的发送范围的文件目录
Domain=domain	限制 cookie 生效的域名
secure	进制 HTTP 安全连接时才发送 cookie
HttpOnly	JS 脚本无法获得 cookie
SameSite=[None\|Strict\|Lax]	None：同站、跨站都可以发送 Strict：仅在同站发送 Lax：允许与顶级导航一起发送

HTTP/2 概述
1. 帧（frame）：HTTP/2 通信的最小单位，每个帧都包含帧头，至少也会标识出当前帧所属的数据流
2. 消息：与逻辑去或响应信息对应的完整的一系列帧
3. 数据流：已建立的连接内的双向字节流，可以承载一条或多条信息
4. 流控制：阻止发送方向接收方发送大量数据的机制
HTTPS 概述
1. Hyper Text Transfer Protocol Secure
2. 通过 TSL/SSL 加密
  1. 对称加密：密钥相同
  2. 非对称加密：分公钥和私钥

0x3 场景分析

静态资源
1. 静态资源方案：缓存 + CDN + 文件名Hash
  - CDN：Content Delivery Network
  - 通过用户就近性和服务器负载的判断，CDN 确保内容以一种极为高效的方式为用户的请求提供服务
登录
1. 业务场景：表单填写/扫码
2. 技术方式：SSO（单点登录：Single Sign On）
3. 当出现跨域时，会出现 OPTIONS 请求
  - 域名构成：[Scheme]://[HostName]:[port]
4. 操作流程
  1. 向目标域名的目标 path 使用 POST 方法发送请求
  2. 携带信息：
    - 发送的数据格式为 form（表单）
    - 希望获取的数据格式为 json
    - 已有的 cookie
  3. 返回信息
    - 数据格式为 json
    - 各种 cookie 的信息
  4. 鉴权
    - Session + cookie
    - JSON Web Token
跨域
1. 跨域解决方案
  1. CORS：Cross-Origin Resource Sharing
  2. 代理服务器
  3. Iframe（不推荐）

0x4 实战分析

浏览器

Ajax 的 XHR

XHR：XML Http Request

ready	说明
UNSENT	代理被创建，但尚未调用`open()`方法
OPENED	`open()`方法已被调用
HEADERS_RECEIVED	`send()`方法已被调用，并且头部和状态已经可获得
LOADING	下载中
DONE	下载操作已完成

Ajax 的 Fetch

XHR 升级版
使用 Promise
模块化设计响应、请求和头部对象
通过数据流处理对象，支持分块读取

postData('http://example.com/answer', { answer: 42 })

    .then(data => console.log(data))

    .catch(err => console.log(err))

function postData(url, data) {

    return fetch(url, {

        body: JSON.stringify(data),

        cache: 'no-cache',

        credentials: 'same-origin',

        headers: {

            'user-agent': 'Mozila/4.0 MDN Example',

            'content-type': 'application/json'

        },

        method: 'POST',

        mode: 'cors',

        redirect: 'follow',

        referrer: 'no-referrer'

    }).then(res => res.json())

}

NodeJS

标准库 HTTP/HTTPS
1. 默认模块，功能有限

常用请求库 axios

// 全局配置

axios.defaults.baseURL = "http://api.example.com";

// 添加请求拦截器

axios.interceptors.request.use(function(cfg) {

    // 在发送请求前的操作

    return cfg;

}, function(err) {

    // 对错误请求的操作

    return Promise.reject(err);

});

// 发送请求

axios({

    method: 'get',

    url: 'http://test.com',

    responseType: 'stream'

}).then(function(res) {

    res.data.pipe(fs.createWriteStream('ada_lovelace.jpg'))

});

用户体验
1. 网络优化
  
  graph TB
  A(网络优化)-->B(HTTP/2)
  B-->B1(优势)
  B1-->B11(Binary Format)
  B1-->B12(Multiplexed)
  B1-->B13(Server Push)
  B1-->B14(Header Optimize)
  B-->B2(兼容性)
  B-->B3(简单实践)
  B-->B4(HTTP/3)
  A-->C(CDN 动态加速)
  C-->C1(适用场景)
  C-->C2(缓存)
  C2-->C21(回源策略)
  C2-->C22(缓存刷新)
  C2-->C23(缓存预热)
  C2-->C24(缓存击穿)
  C-->C3(实践)
  A-->D(DNS 预解析)
  A-->E(网络预连接)
  A-->F(域名)
  F-->F1(域名收敛)
  F-->F2(域名发散)
  A-->G(压缩)
  G-->G1(gzip)
  G-->G2(brotil)
  A-->H(HTTPS 性能优化)
2. 稳定性
  
  graph TB
  A(稳定性)-->B(重试机制)
  B-->B1(超时)
  B-->B2(错误)
  A-->C(缓存)
  A-->D(数据安全)
  D-->D1(HTTPS)
  D-->D2(劫持)

0x5 扩展

通信方式-WebSocket
- 浏览器与服务器进行全双工通讯的网络技术
- 适用于对实时性要求较高的场景
- URL 使用ws://或wss://等开头
QUIC
- Quick UDP Internet Connection

首发于HTTP 使用指南 | 青训营笔记

-End-

HTTP 使用指南的更多相关文章

JavaScript权威指南 - 函数
函数本身就是一段JavaScript代码,定义一次但可能被调用任意次.如果函数挂载在一个对象上,作为对象的一个属性,通常这种函数被称作对象的方法.用于初始化一个新创建的对象的函数被称作构造函数. 相对 ...
UE4新手之编程指南
虚幻引擎4为程序员提供了两套工具集,可共同使用来加速开发的工作流程. 新的游戏类.Slate和Canvas用户接口元素以及编辑器功能可以使用C++语言来编写,并且在使用Visual Studio 或 ...
JavaScript权威指南 - 对象
JavaScript对象可以看作是属性的无序集合,每个属性就是一个键值对,可增可删. JavaScript中的所有事物都是对象:字符串.数字.数组.日期,等等. JavaScript对象除了可以保持自 ...
JavaScript权威指南 - 数组
JavaScript数组是一种特殊类型的对象. JavaScript数组元素可以为任意类型,最大容纳232-1个元素. JavaScript数组是动态的,有新元素添加时,自动更新length属性. J ...
const extern static 终极指南
const extern static 终极指南不管是从事哪种语言的开发工作,const extern static 这三个关键字的用法和原理都是我们必须明白的.本文将对此做出非常详细的讲解. co ...
Atitit.研发管理软件公司的软资产列表指南
Atitit.研发管理软件公司的软资产列表指南 1. Isv模型下的软资产1 2. 实现层面implet1 3. 规范spec层1 4. 法则定律等val层的总结2 1. Isv模型下的软资产 Sof ...
HA 高可用软件系统保养指南
又过了一年 618,六月是公司一年一度的大促月,一般提前一个月各系统就会减少需求和功能的开发,转而更多去关注系统可用性.稳定性和管控性等方面的非功能需求.大促前的准备工作一般叫作「备战」,可以把线上运 ...
第六代智能英特尔® 酷睿™ 处理器图形 API 开发人员指南
欢迎查看第六代智能英特尔® 酷睿™ 处理器图形 API 开发人员指南,该处理器可为开发人员和最终用户提供领先的 CPU 和图形性能增强.各种新特性和功能以及显著提高的性能. 本指南旨在帮助软件开发人员 ...
Visual Studio Code 配置指南
Visual Studio Code (简称 VS Code)是由微软研发的一款免费.开源的跨平台文本(代码)编辑器.在我看来它是「一款完美的编辑器」. 本文是有关 VS Code 的特性介绍与配置指 ...
Web API 入门指南 - 闲话安全
Web API入门指南有些朋友回复问了些安全方面的问题,安全方面可以写的东西实在太多了,这里尽量围绕着Web API的安全性来展开,介绍一些安全的基本概念,常见安全隐患.相关的防御技巧以及Web AP ...

随机推荐

FeignClient 报错: A bean with that name has already been defined and overriding is disabled.
1. 错误信息 *************************** APPLICATION FAILED TO START *************************** Descript ...
Java 多线程------例子（2） --创建三个窗口买票总票数为 100张使用实现Runnabel接口的方式
1 package com.bytezero.threadexer; 2 3 /** 4 * 创建三个窗口买票总票数为 100张使用实现Runnabel接口的方式 5 * 6 * @autho ...
VC-MFC 登陆界面 + 数据库账号+密码
1 // DlgUser.cpp : 实现文件 2 // 3 4 #include "stdafx.h" 5 #include "Login.h" 6 #inc ...
2、hystrix原理
hystrix熔断机制 1.隔离机制线程隔离: Hystrix在用户请求和服务之间加入了线程池. Hystrix为每个依赖调用分配一个小的线程池,如果线程池已满调用将被立即拒绝,默认不采用排队.加速 ...
使用go语言开发自动化API测试工具
前言上一篇文章说到我还开发了一个独立的自动测试工具,可以根据 OpenAPI 的文档来测试,并且在测试完成后输出测试报告,报告内容包括每个接口是否测试通过和响应时间等. 这个工具我使用了 go 语言 ...
网络流与各种建模（I）
网络流与各种建模(I) 网络流基础这里默认读者学习过网络流和MCMF,这里仅作复习网络流解决的问题是给一个源点和汇点,每个边有最大流量,最大化从源点放水到汇点的速率. 网络流的时间复杂度是 \(O ...
TLS原理与实践（四）国密TLS
主页个人微信公众号:密码应用技术实战个人博客园首页:https://www.cnblogs.com/informatics/ 引言 TLS作为保证网络通信安全的关键技术和基石被广泛应用,但目前主流 ...
多线程系列(二十) -CompletableFuture使用详解
一.摘要在上篇文章中,我们介绍了Future相关的用法,使用它可以获取异步任务执行的返回值. 我们再次回顾一下Future相关的用法. public class FutureTest { publi ...
1、Azure Devops之什么是Azure DevOps
什么是Azure DevOps 1.师出名门:是微软推出的一个集项目管理.开发管理.测试管理的一个服务套件. 2.历史:前身是微软在2005年推出的Team foundation Server一个专门 ...
检验实时3D像素流送平台好坏的七个标准！（下）
上篇文章我们介绍了<检验实时3D像素流送平台质量的七个标准>中的前四个标准,本文我们将继续给您介绍检验像素流送平台质量的其他三个标准. 您的平台是通过云还是仅通过渲染的图像传输数据? 您的 ...