浅学HTTP|青训营笔记

Aaron450
121 阅读4分钟

浅学HTTP|青训营笔记

这是我参与「第四届青训营 」笔记创作活动的的第6天

初识

什么是HTTP

  • Hyper Text Transfer Protocol（超文本传输协议）
  • 应用层协议，基于TCP协议
  • 请求响应
  • 简单可扩展
  • 无状态

协议分析

发展

1. HTTP/0.9（单行协议）

  • 请求GET/mypage.html
  • 响应只有HTML文档

2. HTTP/1.0（构建可扩展性)

  • 增加了Header
  • 有了状态码
  • 支持多种文档类型
  • ...

3. HTTP/1.1（标准化协议）

  • 链接复用
  • 缓存
  • 内容协商
  • ...

4. HTTP/2（更优异的表现）

  • 二进制协议
  • 压缩header
  • 服务器推送
  • ...

5. HTTP/3（草案）

报文

image.png

image.png

这些Method是：

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

状态码

image.png
  • 200 OK - 客户端请求成功
  • 301 - 资源（网页等）被永久转移到其它URL
  • 302 - 临时跳转
  • 401 Unauthorized - 请求未经授权
  • 404 - 请求资源不存在，可能是输入了错误的URL
  • 500 - 服务器内部发生了不可预期的错误
  • 504 Gateway Timeout - 网关或者代理的服务器无法在规定的时间内获得想要的响应

RESTful API：一种API设计风格；REST-Representational State Transfer

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

image.png

常用请求头

image.png

常用响应头

image.png

缓存

image.png

image.png

cookie

Set-Cookie-response

image.png

HTTP/2概述

更快、更稳定、更简单

  1. 帧（frame）：HTTP/2通信的最小单位，每个帧都包含帧头，至少也会标识出当前帧所属的数据流。
  2. 消息：与逻辑请求或响应消息对应的完整的一系列帧
  3. 数据流：已建立的链接内的双向字节流，可以承载一条或多条消息
  • 二进制
  • 交错发送，接受方重组织
  • HTTP/2连接都是永久的，而且仅需要每个来源一个连接
  • 流控制：阻止发送方向接受方发送大量数据的机制

HTTPS概述

  • HTTPS：Hypertext Transfer Protocol Secure
  • 经过TSL/SSL加密
  • 对称加密：加密和解密都是使用同一个密钥
  • 非对称加密，加密和解密需要使用两个不同的密钥：公钥（public key）和私钥（private key）

常见场景

  1. 打开chrome
  2. 输入www.toutiao.com/
  3. 打开控制台
  • 右键——>检查
  • F12
  1. 切换到network

静态资源

缓存策略是怎样的？

  • 强缓存
  • Cache-control：一年

还有什么信息吗？

  • 允许所有域名访问
  • 资源类型：CSS

静态资源方案：缓存+CDN+文件名hash

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

实际应用

浏览器

AJAX之XHR

  • XHR：XMLHttpRequest
  • readyState
image.png

image.png

AJAX之Fetch XMLHttpRequet的升级版

  • 使用Promise
  • 模块化设计，Response、Request、Header对象
  • 通过数据流处理对象，支持分块读取

image.png

标准库：HTTP/HTTPS

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

image.png

常用的请求库：axios

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

用户体验

image.png

image.png

了解更多

通信方式

WebSocket

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

扩展

QUIC：Quick UDP Internet Connection

  • O-RTT建联（首次建联除外）
  • 类似TCP的可靠传输
  • 类似TLS的加密传输，支持完美前向安全
  • 用户空间的拥塞控制，最新的BBR算法
  • 支持h2的基于流的多路复用，但没有TCP的HOL问题
  • 前向纠错FEC
  • 类似MPTCP的Connection migration
image.png image.png

个人总结

本次老师也是偏重理论为主，干货满满，需要慢慢消化。

avatar
文章
阅读
粉丝