(五)HTTP实用指南 | 青训营笔记

48 阅读2分钟

“这是我参与「第五届青训营」伴学笔记创作活动的第 5 天”

主要内容

  1. HTTP 协议的基本定义
  2. HTTP 协议主要特征
  3. HTTP 协议发展历程
  4. HTTP 协议的报文结构
  5. 应用场景分析 —— 静态资源、登录
  6. HTTP协议实战 —— 浏览器、Node
  7. 网络优化手段
  8. HTTP协议拓展 —— 通讯方式

1 初识HTTP

1.1 背景知识

image.png

image.png

  • TCP协议
    • 面向连接 ← 建立连接和关闭连接的方式
    • 点对点(一对一) ← 流量控制(发送方和接收方的传输速率协调)
    • 可靠交付 ← 错误确认和重传
    • 面向字节流,仅仅把上层协议传递过来的数据当成字节传输。 ← 拥塞控制

1.2 什么是HTTP?

  • Hyper Text Transfer Protocol 超文本传输协议
  • 应用层协议,基于TCP协议
  • 请求 响应
  • 简单可扩展
  • 无状态,每个请求是孤立的 image.png
  • 请求 image.png
  • 响应 image.png

2 协议分析

2.1 发展

image.png

2.2 报文

image.png

  • Method
    • Safe: 不会修改服务器的数据的方法。 GET HEAD OPTIONS
    • Idempotent(幂等): 同样的请求被执行一次与连续执行多次的效果是一样的,服务器的状态也是一样的。所有的safe方法都是idempotent的。 GET HEAD OPTIONS PUT DELETE image.png
  • 状态码 image.png
  • RESTful API —— 一种API设计风格;REST - Representational State Transfer
    • 每一个URI代表一种资源
    • 客户端和服务器之间,传递这种资源的某种表现层
    • 客户端通过HTTP method,对服务器端资源进行操作,实现“表现层状态转化”。 image.png
  • 常用请求头 image.png
  • 常用响应头 image.png
  • 缓存
    • must-revalidate,配合max-age使用。一个场景是client和server disconnect后如果must-revalidate则不能用缓存。 image.png
  • cookie image.png

2.3 HTTP/2概述 —— 更快、更稳定、更简单

image.png image.png image.png

2.4 HTTPS概述

image.png

image.png

image.png

3 常见场景分析

3.1 静态资源

  • 打开chrome
  • 输入www.toutiao.com
  • 打开控制台
    • 右键 -> 检查
    • F12
  • 切换到network image.png image.png

状态码200一定发起请求了吗?

答案是否定的。从下面的截图里可以看出,这里的CSS资源是从本地缓存中拿到的。 image.png

image.png

image.png

3.2 登录

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

image.png

  • 适合使用jwt的场景:
    • 有效期短
    • 只希望被使用一次
    • 比如,用户注册后发一封邮件让其激活账户,通常邮件中需要有一个链接,这个链接需要具备以下的特性:能够标识用户,该链接具有时效性(通常只允许几小时之内激活),不能被篡改以激活其他可能的账户,一次性的。这种场景就适合使用jwt。
    • 而由于jwt具有一次性的特性。单点登录和会话管理非常不适合用jwt,如果在服务端部署额外的逻辑存储jwt的状态,那还不如使用session。基于session有很多成熟的框架可以开箱即用,但是用jwt还要自己实现逻辑。

image.png

image.png

4 实战

4.1 浏览器/Node.js

image.png

image.png

image.png

4.2 常用库

image.png

image.png

image.png

5 了解更多

5.1 WebSocket

image.png

5.2 QUIC

image.png