了解http网络协议

URI URL URN

URI 统一资源标识符用来唯一标识互联网上的信息资源包括URL和URN
URL 统一资源定位符如:https://www.baidu.com/s?wd=aa
URN 统一资源名称永久统一资源定位符在资源更换地址后还能找到

HTTP报文格式

首部(头): 通用头、请求头、响应头
主体：请求主体、响应主体

General 通用头

Request URL: https://mcs.snssdk.com/v1/list // 请求地址
Request Method: POST  // 请求方式: GET/POST/DELETE/PUT/HEAD/OPTIONS...
Status Code: 200  // 响应HTTP状态码
Remote Address: 39.137.10.72:443 // 主机地址(服务器外网IP地址)
Referrer Policy: strict-origin-when-cross-origin //

Request Headers 请求头 [客户端设置, 服务器接收]

GET / HTTP/1.1  // 请求起始行 HTTP版本
Accept: text/plain //
Accept-Encoding: gzip, deflate, br
Accept-Language: zh-CN,zh;q=0.9
Connection: keep-alive
Cookie: BIDUPSID=16D64E6825470684002A45FDEA8CD3B3;
Host: www.baidu.com
Referer: https://www.baidu.com/?tn=02003390_hao_pg
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/105.0.0.0 Safari/537.36

Response Headers 响应头 [服务器端设置, 客户端获取]

HTTP/1.1 200 OK // 响应起始行
Cache-Control: private
Connection: keep-alive
Content-Encoding: gzip
Content-Type: text/html;charset=utf-8
Date: Mon, 03 Oct 2022 10:52:55 GMT // 服务器响应内容时的服务器端时间
Expires: Mon, 03 Oct 2022 10:52:55 GMT
Server: BWS/1.0
Vary: Accept-Encoding
Content-Length: 78

Response [响应主体] 服务器响应的内容
Request Payload / Form Data / [请求主体] 客户端请求参数

当用户在地址栏输入网址, 到最后看到页面, 中间都经历了什么?

URL地址解析
DNS域名解析 根据域名在DNS服务器上查找到对应服务器的外网IP地址
和服务器建立TCP连接
把客户端信息传递给服务器(发送HTTP请求)
服务器接收并处理请求(HTTP响应内容)
客户端渲染服务器返回的内容
和服务器端断开TCP连接

建立TCP连接(三次握手) 发生在信息传输前

第一次握手: 由浏览器发起, 告诉服务器我要发送请求了
第二次握手: 由服务器发起, 告诉浏览器我准备接受了, 你发吧
第三次握手: 由浏览器发起, 告诉服务器, 我开始发送了

断开TCP连接(四次挥手) 发生在信息传输过程中

第一次挥手: 由浏览器发起, 发送给服务器, 我请求报文发送完了, 你准备关闭吧
第二次挥手: 由服务器发起, 告诉浏览器, 我接收完请求报文, 我准备关闭了
第三次挥手: 由服务器发起, 告诉浏览器, 我响应报文发送完毕, 你准备关闭吧
第四次挥手: 由浏览器发起, 告诉服务器, 我响应报文接收完毕, 我准备关闭, 你也关闭吧

CORS

cors预请求允许方法 GET HEAD POST
cors预请求允许content-type text/plain multipart/form-data application/x-www-form-urlencoded

缓存头Cache-control

可缓存性 public private no-cahe
到期时间 max-age=seconds s-maxage=seconds max-stale=seconds

其他 no-store no-transform

// 客户端 index.html
<script src="/cache.js"></script>
// 服务端 server.js
if (request.url === '/cache.js') {
  response.writeHead(200, {
    'Content-Type': 'text/javascript',
    'Cache-Control': 'max-age=20'
  })
  response.end('console.log("script loaded")')
}
// 使用 Cache-Control:max-age=20后 客户端再20S之内访问cache会读取客户端缓存得cache.js,过期后会重新请求
// 服务端 server.js
if (request.url === '/cache.js') {
  response.writeHead(200, {
    'Content-Type': 'text/javascript',
    'Cache-Control': 'no-store'
  })
  response.end('console.log("script loaded")')
}
// 使用Cache-Control: no-store 禁止客户端使用缓存

Last-Modified 上次修改时间配合If-Modified-Since或者If-Unmodified-Since使用对比上次修改时间以验证资源是否需要更新
Etag 数据签名配合If-Match或者If-Non-Match使用对比资源的签名判断是否使用缓存
参考文章：Expires、Cache-Control、Last-Modified和If-Modified—Since、Etag和If-None-Match 通过HTTP Header控制缓存

Cookie与session

cookie 通过Set-Cookie设置下次请求会自动带上，键值对，可以设置多个
cookie生成方式: http response header中的set-cookie

// 1. max-age和expires设置过期时间
// 2. secure只在https时候发送
// 3. HttpOnly无法通过document.cookie访问
// 服务端
response.writeHead(200, {
  'Content-Type': 'text/html',
  // 'Set-Cookie': 'id=123' // 设置单个cookie
  // 'Set-Cookie': 'id=123;max-age=5' // 设置单个cookie失效时间
  // 'Set-Cookie': ['id=123;max-age=5','abc=456'] // 设置多个cookie
  'Set-Cookie': ['id=123; max-age=2', 'abc=456;domain=test.com'] // 设置多个cookie并设置domain
})
// 客户端 获取cookie
console.log(document.cookie)

session

Http长连接 `Connection': 'keep-alive'` （HTTP1.1才支持）

HTTP协议采用请求-应答模式，当使用普通模式，非keep-alive时，每个请求/应答,客户端和服务端都要新建一个连接，完成之后立即断开（HTTP为无连接的协议）
当使用Keep-alive模式（又称持久连接，长链接），keep-alive功能使客户端到服务器端的连接持续有效，当客户端对服务器有后继请求时，keep-alive功能避免了重新建立连接。

Accept等头部信息

Accept: text/html
Accept-Encoding:gzip,deflate,br
Accept-Language:zh-CN,zh;q:0.9
User-Agent: Mozilla/5.0 (iPhone; CPU iPhone OS 11_0 like Mac OS X) AppleWebKit/604.1.38 (KHTML, like Gecko) Version/11.0 Mobile/15A372 Safari/604.1
referer: 发出请求的页面的URL

Content

Content-Type
- Content-Type:’application/x-www-form-urlencoded’ name=1212&password=sds
- Content-Type: multipart/form-data; boundary=—-WebKitFormBoundary5hG57FPGsLkJqcnt
Content-Encoding:’gzip’
Content-Language

重定向 Location

301与302区别浏览器第二次访问时不在请求服务器从失效链接重定向新的地址，而直接请求新地址

Content-Security-Policy

客户端请求 http.request

application/json
application/x-www-form-urlencoded 表单提交
multipart/form-data 文件上传
text/xml

消息头

Content-Type<实体首部>：发送内容类型
Content-Length<实体首部>：发送内容长度
Location<响应首部>：重定向地址
Cookie<请求首部>：包含要发送给服务器的Cookie
Set-Cookie<响应首部>：服务器端向客户端发送 cookie

状态码

1xx 提示信息–表示请求已被成功接收，继续处理
2xx 成功 - 表示请求已被成功接收，理解，接受
3xx 重定向 - 要完成请求必须进行更进一步的处理
4xx 客户端错误 - 请求有语法错误或请求无法实现
5xx 服务器端错误 - 服务器未能实现合法的请求

http状态码有那些？分别代表是什么意思？

100 Continue 继续，一般在发送post请求时，已发送了http header之后服务端将返回此信息，表示确认，之后发送具体参数信息
200 OK 客户端请求成功，正常返回信息
201 Created 请求成功并且服务器创建了新的资源
202 Accepted 服务器已接受请求，但尚未处理
301 Moved Permanently 永久重定向。旧地址已废弃无法访问，第二次访问时，不在请求服务器从失效链接重定向新的地址，而直接请求新地址
302 Found 临时性重定向。旧地址还可以访问
303 See Other 临时性重定向，且总是使用 GET 请求新的 URI。
304 Not Modified 自从上次请求后，请求的网页未修改过。服务端告诉浏览器可以使用缓存
400 Bad Request 客户端请求有语法错误，不能被服务器所理解
401 Unauthorized 请求未授权。
403 Forbidden 禁止访问。服务器收到请求但是拒绝提供服务
404 Not Found 请求资源不存在
500 Internal Server Error 最常见的服务器端错误。服务器发生不可预期的错误
503 Service Unavailable 服务器端暂时无法处理请求（可能是过载或维护）。

HTTPS

HTTPS是使用加密通道来传输HTTP的内容。但是HTTPS首先与服务端建立一条TLS加密通道。TLS构建于TCP协议之上，它实际上是对传输的内容做一次加密，所以从传输内容上看，HTTPS跟HTTP没有任何区别。
HTTPS的作用

确定请求的目标服务端身份
保证传输的数据不会被网络中间节点窃听或者篡改

HTTP2

服务端推送能够在客户端发送第一个请求到服务端时，提前把一部分内容推送给客户端，放入缓存当中，这可以避免客户端请求顺序带来的并行度不高，从而导致的性能问题。
TCP连接复用，则使用同一个TCP连接来传输多个HTTP请求，避免了TCP连接建立时的三次握手开销，和初建TCP连接时传输窗口小的问题。
HTTP2改进点

支持服务端推送
支持TCP连接复用

TEW's blog