- 这是我参与第五届青训营伴学笔记创作活动的第5天
初识HTTP
什么是HTTP
- Hyper Text Transfer Protocol 超文本传输协议
- 应用层协议,基于TCP协议
- 请求响应
- 简单可扩展
- 无状态
协议分析
发展
报文
- Method
- Safe(安全的):不会修改服务器数据的方法 GET HEAD OPTIONS
- Idempotent(幂等):同样的请求被执行一次与连续执行多次效果是一样的,服务器状态也是一样的,所有Safe都是Idempotent的 GET HEAD OPTIONS PUT DELETE
状态码
- 200 OK 客户端请求成功
- 301 资源被永久转移到其他URL
- 401 Unauthorized 请求未经授权
- 404 请求资源不存在 可能输错了URL
- 500 服务器内部发生了不可预期的错误
- 504 Gatrway Timeout 网关或者代理服务器无法再规定时间内获得想要响应
RESRful API
- 是一种设计风格 REST Representational State Transfer
- 每一个URL代表一种资源
- 客户端服务器之间,传递这猴子那个资源的某种表现层
- 客户端通过HTTP method 对服务器资源进行操作,实现表现层状态转换
常用请求头
常用响应头
缓存
- 强缓存
- 协商缓存
- 缓存流程
cookie
HTTP/2:更快 更稳定 更简单
-
帧frame HTTP/2通信最小的单位,每个帧都包含帧头,至少也会标识出当前帧所属的数据流
-
消息:与逻辑请求或响应消息对应的完整的一系列帧
-
数据流:已建立的连接内的双向字节流,可以承载一条或多条消息
-
HTTP/2有意思的特性
- HTTP/2连接都是永久的,而且仅需要每个来源一个连接
- 流控制:阻止发送方向接收方发送大量数据的机制
- 服务器推送
HTTPS
- Hyper Text Transfer Protocol Secuer
- 经过TSL/SSL加密
- 对称加密:加密和解密使用同一个密钥
- 非对称加密,加密和解密需要使用不同的密钥:公钥 和 私钥
常见场景
静态资源
- 静态资源方案:缓存 + CDN + 文件名hash
- CDN:Content Delivery Network
- 通过用户就近性和服务器负载判断,CDN确保内容以一种极为高效的方式为用户的请求提供服务
登录
跨域
- CORS(Cross-Origin Resource Sharing)
- 预请求 获知服务器是否允许该端跨域请求(复杂请求)
- 相关协议头
- 代理服务器
- 同源策略是浏览器的安全策略,不是HTTP的
- Iframe
- 诸多不便
鉴权
- Session + cookie
- JWT(JSON web token)
- SSO:单点登录(Single Sign On)
实际应用
浏览器/node.js
AJAX之XHR
AJAX之Fetch
- XMLHttpRequet的升级版
- 使用Promise
- 模块化设计,ResponseRequest,Header对象
- 通过数据流处理对象,支持分块读取
标准库HTTP/HTTPS
- 默认模块 无需安装其他依赖
- 功能有限/不是十分友好
常用库 axios
- 支持浏览器,nodejs环境
- 丰富的拦截器
用户体验优化
网络优化
- 预解析 预连接
稳定性
- 重试是保证稳定性的有效手段 但要防止加剧恶劣情况
- 缓存合理使用,作为最后一道防线
了解更多
WebSocket
- 浏览器与服务器进行全双工通讯的网络技术
- 典型场景
- 实时性要求高 例如聊天室
- URL使用ws://或wss://等开头
QUIC
- Quick UDP Internet Connection
- 0-RTT建联(首次建联除外)。
- 类似TCP的可靠传输
- 类似TLS的加密传输,支持完美前向安全。
- 用户空间的拥塞控制,最新的BBR算法
- 支持h2的基于流的多路复用,但没有TCP的HOL问题
- 前向纠错FEC
- 类似MPTCP的Connection migration。