HTTP使用指南 ｜ 青训营笔记

Judy_霖子
85 阅读5分钟

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

本堂课重点（不熟悉）内容：

TCP协议

  • TCP协议连接的特点：面向连接、点对点（一对一）、可靠交付、面向字节流。
  • TCP协议方法：建立连接和关闭连接的方式、可靠传输（错误确认和重传）、流量控制（发送方和接收方的传输速率协调）、拥塞控制

HTTP

HTTP协议是超文本传输协议，是基于TCP协议的应用层协议，具有 请求响应、简单可扩展、无状态 的特点。（无状态：没有记忆能力，每个请求都是独立的） image.png 用户在浏览器中输入网址，browser进程对输入信息进行处理，浏览器再对 服务器 发起请求，并读取响应，并进行渲染，browser进程进行页面加载

从HTTP/0.9到HTTP/3草案

HTTP/1.1 是标准化版本，使用时间最久的，之后的协议改进了用户的体验，使得传输更快、更稳定

image.png

方法的分类：

  • Safe安全：不会修改服务器数据的方法GET HEAD OPTIONS
  • Idempotent幂等：同样的请求被执行一次与连续执行多次效果一致，服务器状态一致 （安全的方法同样是幂等的）GET HEAD OPTIONS PUT DELETE

状态码： image.png

RESTful API：一种API设计风格

  • 每个URI代表一种资源
  • 客户端和服务器之间，传递这种资源的某种表现层
  • 客户端通过HTTP method，对服务器端资源进行操作，实现“表现层状态转化”

image.png

image.png

image.png

缓存：

image.png

must-revalidate，配合max-age使用。一个场景是client和server disconnect后如果must-revalidate则不能用缓存

image.png

cookie: image.png

HTTP/2.0 :更快、更稳定、更简单 现在的主流行 帧（frame）:HTTP/2.0通信的最小单位，每个帧都包含帧头，至少也会标识出当前帧所属的数据流。 消息：概念，即为 与逻辑请求或响应消息对应的完整的 一系列帧 。 数据流：已建立的连接内的双向字节流，可以承载一条或多条消息。

  • 交错发送，接收方重组织

image.png

HTTP/2.0 连接是永久的，而且仅需要每个来源一个连接 流控制：阻止发送方向接收方发送大量数据的机制

  • 服务器推送：推送JS、CSS时，服务器提前察觉，提前渲染；播放视频时暂停，不再缓存之后的所有内容，将静态资源分配给优先级更高的资源

image.png

加密：

  • 对称加密：加密和解密的秘钥是同一个
  • 非对称加密：运用公钥（public key）和私钥（private key） ，加密、解密需要两个不同的秘钥。

image.png

场景分析

步骤： image.png

image.png 表明虽然返回“200”的状态码，但信息来源于 (from disk cache) 磁盘缓存，并不是真正地获取了资源

image.png 缓存策略：

  • 强缓存：一年
  • 允许所有域名访问
  • 资源类型：css （content-type 所携带的资源类型）

静态资源部署方案：缓存 + CDN + 文件名hash 将静态资源放在CDN上，同时对文件名，版本号，做哈希的打包策略

目的：提高静态资源的访问速度

  • CDN：Content + Delivery Network
  • 通过用户就近性和服务器负载的判断，CDN确保内容以一种极为高效的方式为用户的请求提供服务 image.png

目的：用户获取的都是最新的数据

  • 文件名改变使得用户获得的都为最新
  • 使用 rather 或 vue ，例如 rather-16 使得旧版本会match不上

登录

image.png

跨域

image.png

  • 简单请求
  • 复杂请求（大部分情况下）：仅在复杂请求下才会发起跨域请求

解决方案一：CORS image.png

解决方案二：代理服务器 通过代理服务器绕开浏览器的限制：部署一个域名跟我们所在位置同样的代理服务器，天然地没有跨域的问题

image.png

解决方案三：lframe（限制会比较多）

鉴权

  • 方法一：Session + cookie
    • session有很多成熟的框架可以开箱即用，jwt需要自己实现逻辑
  • 方法二：JWT（JSON web token）：适合有效期短，只希望被使用一次
    • 场景：用户注册后发一封邮件使其激活账户，通常邮件中需要一个能够标识用户、具有时效性、不能被篡改以激活其他可能的账户、一次性的链接
    • 单次登录和会话管理不适合使用jwt

跳转页面的同时登陆：用户折损率低

解决方案：SSO单点登陆 单点登录（SSO）-阿里云开发者社区 (aliyun.com)

image.png

发起HTTP协议

浏览器

XHR

image.png

Fetch

image.png

node篇

HTTP/HTTPS
  • 默认模块，无需安装其他依赖
  • 功能有限/不是十分友好 image.png

常用的请求库：axios

  • 支持浏览器、nodejs环境
  • 丰富的拦截器

image.png

网络优化：

image.png

image.png

拓展

WebSocket

  • 浏览器与服务器进行全双工通讯的网络技术
  • 典型场景：实时性要求高，例如聊天室
  • URL使用 ws:// 或 wss:// 等开头

image.png

QUIC：

image.png

详细知识点介绍：

  1. HTTP协议简介
  2. HTTP协议的基本结构和发展历程
  3. 常见场景中的HTTP协议应用
  4. 在不同的环境中发起HTTP请求
  5. 知识拓展，了解更多网络通信协议

引用参考：

HTTP基础指南

精读《图解HTTP》

PPT: PPT

avatar
文章
阅读
粉丝