HTTP使用指南
初识HTTP
发生了什么？
什么是HTTP
- Hyper Text Transfer Protocol 超文本传输协议
- 应用层协议，基于TCP协议
- 请求 响应
- 简单可扩展
- 无状态
协议分析
发展
报文
- 200 OK - 客户端请求成功
- 301 - 资源（网页等）被永久转移到其它 URL
- 302 - 临时跳转
- 401 Unauthorized - 请求未经授权
- 404 - 请求资源不存在，可能是输入了错误的 URL
- 500 - 服务器内部发生了不可预期的错误
- 504 Gateway Timeout - 网关或者代理的服务器无法在规定的时间内获得想要的响应
RESTful API：一种API设计风格；REST-Representational State Transfer
- 每一个URL代表一种资源
- 客户端和服务器之间，传递这种资源的某种表现层
- 客户端通过HTTP method，对服务器端资源进行操作，实现“表现层状态转化”
发展
场景分析
场景分析
-
打开chrome
-
打开控制台
- 右键 → 检查
- F12
-
切换到network
- 静态资源
- 登录
静态资源
静态资源方案：缓存 + CDN + 文件名hash
- CDN：Content Delivery Network
- 通过用户就近性和服务器负载的判断，CDN确保内容以一种极为高效的方式为用户的请求提供服务
登录
-
业务场景
- 表单登录
- 扫码登陆
-
技术方式
- SSO
- 账号密码登录
- 打开控制台 - network -勾选 preserve log - 过滤quick_login
- 观察请求
为什么会有options的请求？
- 跨域，cross-origin
跨域
跨域
-
CORS（Cross-Origin Resource Sharing）
-
预请求：获知服务端是否允许该跨域源请求（复杂请求）
-
相关协议头
- Access-Control-Allow-Origin
- Access-Control-Expose-Headers
- Access-Control-Max-Age
- Access-Control-Allow-Credentials
- Access-Control-Allow-Methods
- Access-Control-Allow-Headers
- Access-Control-Request-Methid
- Access-Control-Request-Headers
- Origin
跨域解决方案：
-
CORS
-
代理服务器
- 同源策略是浏览器的安全策略，不是HTTP的
-
Iframe
- 诸多不便
登录
- 向什么地址做了什么动作？
- 使用POST方法
- 目标域名 sso.toutiao.com
- 目标path/quick_login/v2/
- 携带了哪些信息，返回了那些信息
-
携带信息
- Post body，数据格式为form
- 希望获取的数据格式为json
- 已有的cookie
-
返回信息
- 数据格式json
- 种cookie的信息
下一次进入页面为什么能记住登录态呢？
- SSO：单点登录（Single Sign On）
实战
浏览器篇
AJAX之Fetch
- XMLHttpRequest的升级版
- 使用Promise
- 模块化设计，Response，Request，Header对象
- 通过数据流处理对象，支持分块读取
node篇
标准库：HTTP/HTTPS
- 默认模板，无需安装其他依赖
- 功能有限/不是十分友好
常见的请求库：axios
- 支持浏览器、node.js环境
- 丰富的拦截器
用户体验
- 重试是保证稳定的有效手段，但要防止加剧恶劣情况
- 缓存合理使用，作为最后一道防线
了解更多
拓展 - 通信方式
WebSocket
- 浏览器与服务器进行全双工通讯的网络技术
- 典型场景：实时性要求高，例如聊天室
- URL 使用ws:// 或 wss:// 等开头
QUIC：Quick UDP Internet Connection
- O-RTT 建联（首次建联除外）
- 类似TCP的可靠传输
- 类似TLS的加密传输，支持完美前向安全
- 用户空间的拥塞控制，最新的BBR算法
- 支持h2的基于流的多路复用，但没有TCP的HOL问题
- 前向纠错FEC
- 类似MPTCP的Connection migration
