这是我参与「第四届青训营」笔记创作活动的的第 4 天。
昨天下午的 HTTP 课程非常完整地讲解了 HTTP 相关的知识点，总结在这篇文章中。主要以大纲的形式列举知识点并作简要介绍，具体细节每个知识点都可以写一篇文章。
浏览器输入 URL 后发生了什么？
这是一个面试常考的问题，能够考察面试者的网络基础 (DNS、HTTP 等) 和对浏览器原理的了解，此处引用老师的一张图来简单概括，详细过程可以看一下这篇文章：深入理解现代浏览器。
HTTP 在其中负责向服务端请求数据，供浏览器渲染给用户看。
HTTP 简介
HTTP (HyperText Transfer Protocol，超文本传输协议) 是基于 TCP 的应用层协议，使用请求/响应的简单交互模型，无状态确保了服务端能高性能、高并发地处理请求，使用 Header 传输元数据使协议可扩展。
HTTP 在 OSI 7 层协议栈和 TCP/IP 4 层协议栈中都属于应用层。
HTTP 通信前通常需要使用 DNS 获取域名对应的 IP，传输层依赖于 TCP 协议，HTTPS 在 TCP 之上添加了一层 TLS 层，实现了防窃听、防篡改、防冒充。
HTTP 版本发展
HTTP/0.9- 只能 GET 请求 HTML 文档
HTTP/1.0- 添加了 Header
- 添加了 Status Code
- 支持多种文档类型
HTTP/1.1- 链接复用
- 缓存
- 内容协商
HTTP/2- 二进制协议
- 压缩 Header
- 服务器推送
HTTP/3(草案)
HTTP 报文结构
HTTP 报文主要分为请求报文 (Request) 和响应报文 (Response)。
请求报文的结构为：
- 第一行包含 3 个字段：HTTP 方法 (Method)、请求的路径 (Path)、使用的 HTTP 版本 (Version)，用空格分隔
- 紧接着的若干行为 Request Headers，每行一个键值对
- 一行空行
- 请求体 (Request Body)
响应报文的结构为：
- 第一行包含 3 个字段：HTTP 版本 (Version)、状态码 (Status Code)、状态消息 (Status Message)
- Response Headers
- 空行
- Response Body
Method
HTTP 方法可以看 MDN 的这篇文章：HTTP request methods
HTTP 部分方法有两个特性：安全性 (Safe) 和幂等性 (Idempotent)。
- 安全性：不会修改服务器数据，包括
GET/HEAD/OPTIONS - 幂等性：执行多次与执行一次的效果相同，包括
GET/HEAD/OPTIONS/PUT/DELETE
Status Code
HTTP 状态码可以分为 5 类，具体看这篇文章：HTTP response status codes。
- 1xx：Informational，指示一些信息
- 100 Continue
- 2xx：Successful，请求成功
- 200 OK
- 201 Created
- 204 No Content
- 3xx：Redirection，重定向
- 301 Moved Permanently
- 302 Found
- 304 Not Modified
- 4xx：Client error，客户端的请求有问题
- 400 Bad Request
- 401 Unauthorized
- 404 Not Found
- 410 Gone
- 5xx：Server error，服务端处理合法请求中出错
- 500 Internal Server Error
- 501 Not Implemented
- 502 Bad Gateway
- 504 Gateway Timeout
Headers
HTTP Headers 可以分为 Request Headers 和 Response Headers，也有一些 Headers 在请求报文和响应报文中都可以使用，具体看这篇文章：HTTP headers。最好根据使用场景来学习，比如缓存、跨域、Cookie 等。
REST
REST (Representational State Transfer，表现层状态转化) 是 Roy Thomas Fielding 在他 2000 年的博士论文中提出的一种 API 设计风格，特征如下：
- 每个 URI 代表一个资源
- 客户端和服务端之间传递资源的一种表现层
- 客户端通过 HTTP 方法操作服务端资源，实现状态转化
AJAX
除了通过浏览器发出 HTTP 请求，也可以通过 JavaScript 发出请求，这种技术称为 AJAX (Asynchronous JavaScript And XML)，包括 XMLHttpRequest 和 fetch。
Node 提供了内置的 http 和 https 模块用于发送 HTTP 请求。
实际开发中主要使用封装好的请求库，比如 Axios。
性能优化
为了快速加载出页面，实现良好的用户体验，需要进行网络优化和稳定性优化。
