前端与HTTP | 青训营笔记

65 阅读2分钟

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

一、重点内容介绍:

1、HTTP 协议的基本定义和特点,发展历程,报文结构
2、HTTP 真实的场景实践
3、HTTP 协议实战

二、详细知识点:

1、HTTP 协议的基本定义和特点

HTTP 协议基本定义

  • HTTP(Hyper Text Transfer Protocol),即超文本传输协议
  • 是应用层的协议,是一个用于传输超文本数据的一个协议
  • 超文本指的是文本,还有图片、视频等等
  • 一般来说,它运行在TCP协议之上并基于TCP协议,具有简单可扩展、无状态的特点。

HTTP 协议主要特点

  • 面向连接
  • 点对点可靠交付
  • 面向字节流,也就是说仅仅把上层协议传递过来的数据当成字节传输。

HTTP 协议的发展历程

  • HTTP/0.9单行协议: 请求GET/page.html ; 响应只有html文档
  • HTTP/1.0构建可扩展性:增加了Header ;有了状态码 ;支持多文档类型
  • HTTP/1.1标准化协议:链接复用 ;缓存 ;内容协商
  • HTTP/2更优异的表现:二进制协议 ;压缩header ;服务器推送
  • HTTP/3草案

HTTP 协议的报文结构

  • 报文,就是被传送的东西,也就是上述通信过程传递的东西,报文有请求报文和应答报文两种。
  • 请求报文:请求行 - 通用信息头 - 请求头 - 实体头 - 报文主体
  • 应答报文:状态行 - 通用信息头 - 响应头 - 实体头 - 报文主体

HTTP状态码

  • 1XX:消息状态码。
  • 2XX:成功状态码。
  • 3XX:重定向状态码。
  • 4XX:客户端错误状态码。
  • 5XX:服务端错误状态码

2、HTTP 真实的场景实践

静态资源:

  • 打开chrome浏览器,F12打开开发者工具
  • 然后切换到network,可以看到请求的资源
  • 还有各类缓存策略
  • 静态资源解决方案 = 缓存+CDN+文件名hash

登录场景

  • 表单登录或扫码登录
  • 使用账号密码登录后,在network中搜索preservelog并过滤
  • 观察cross-oirgin跨越请求

3、HTTP实战

浏览器

  • 可以使用AJAX的XHR和Fetch

NODE

  • 可以使用axios