01 前言

1、建立对计算机网络的整体认知，对计算机网络中的各种概念（网络分层、网络协议、网络应用等）有初步的理解。进而可以在后续的实际工作中能高效解决网络问题。

2、分析方法有自底向上（从易到难） 和自顶向下（从难到易）

02 蟹堡王帝国

网络基础知识引入

03 网络基础

网络组成部分

主机：客户端和服务端
路由器
网络协议

网络结构：网络的网络

比奇堡和小区网络：本地网络
北京和上海分店+比奇堡：三个本地网络节点的网络
全国通信网络：本地网络的网络
区域网络、城域网和广域网

信息交换方式：电路交换&分组交换

电路交换

通信前，建立连接，通信后，拆除连接，通信期间，不管是否有信息传送，连接始终保持，且对通信信息不作处理，也无差错控制措施；
基于同步时分复用方式，连接为物理连接；
实时交换，基于呼叫损失制，只要允许建立连接，就可保证通信质量，过负荷时呼损率增加；
固定分配带宽，资源利用率低，灵活性差；
一般用于电话交换,但也可用于数据交换，用于数据交换时一般速率低于9.6kbit/s；
当节点使用电路交换技术时，可构成电话网（PSTN）、数字数据网（DDN）、移动通信网等。

分组交换

将需要传送的信息分成若干个分组，每个分组加控制信息后分发出去，采用存储转发方式.有差错控制措施。
基于统计时分复用方式.可以不建立连接，也可建立连接，连接为逻辑连接(虚连接)；资源利用率高，共享信道。
有时延，实时性差，不能保证通信质量。
一般用于数据交换，但也可用于分组话音业务。
当节点使用分组交换技术，可构成分组交换网。传统分组交换使用的最典型的协议就是著名的X.25协议。

网络分层

快递员不关心包裹内容
卡车司机不关注车厢里拉的什么
高速公路不关心开的什么车

协议

协议的存在依赖于连接

协议定义了在两个或多个通信实体之间交换的报文格式和顺序，以及报文发送和/或接受一条报文或其他事件所采取的动作。

标头和载荷

收件人、寄件人关注:

收件地址、寄件地址
收件人、寄件人的姓名和电话
包裹内容

快递公司关注:

收件人、寄件人关注的东西
该由哪个集散点发出，哪个集散点收
哪个网点派送

1、为什么要用JWT

在谈起 JWT 之前，我们先了解一下什么是认证。

在登录淘宝、微博等软件或者网站之前，我们需要通过填写账号和密码来校验身份。认证是用来**「验证用户身份合法性」**的一种方式。

那我们登录成功之后，网站如何记录我们的身份信息呢？

在学习 servlet 的时候，知道了传统的系统主要是通过 session 来存储用户的信息。session将用户的信息存储在服务端。

但是随着用户数量的增多，服务端就需要存一堆用户的认证信息，这种方式会不断增加服务端的压力。

如果是分布式系统，用session存储用户信息就太拘束了。因为分布式系统一般都会做负载均衡，如果这次认证成功了，那么意味着下次请求必须仍要访问这台服务器才能认证成功。

如果是前后端分离的系统就更难受了，因为前端代码和后端代码放在不同的服务器上，除了会增加服务器的压力，还会产生跨域等一系列问题，有点得不偿失。

那有没有一种工具能帮我们解决这些认证问题？

服务端不需要存储用户的认证信息
避免跨域
保证数据的安全性

JWT闪亮登场。

2、什么是JWT

JWT 简称: JSON Web Token，又叫做 web 应用中的**「令牌」**。它可以帮助我们完成用户的认证、存储信息、加密数据等功能。

那什么是令牌呢？令牌就相当于古代的虎符。古代将军要想调兵遣将，必须手持虎符。

而用户要想访问系统中的某些页面，在发起的请求中必须携带使用 JWT 生成的令牌。令牌校验通过了，方可访问系统。这里的令牌简称为 token。

3、JWT的结构

注：这里所说的 JWT 的结构，指的是用 JWT 生成令牌的结构，也就是 token 的结构。

令牌的结构组成：

标头(Header)
载荷(Payload)
签名(Signature)

令牌最终的样子是由这三部分组成的字符串：

Header.Payload.Signature

例如：

hjYGH1dajUU.dajhjksfiu2h27jjghg2.kjbhjkf982bhh2lk2

3.1 标头(Header)

标头是使用 Base64 编码将令牌类型和签名算法经过加工后生成的一段字符串。

标头包含两部分：

令牌的类型：JWT(一般是默认的)
签名算法：例如 SHA256、HMAC等

{
"alg": "HS256",
"typ": "JWT"
}

3.2 载荷(Payload)

载荷主要存储一些自定义信息。它也是使用 Base64 编码加工后生成的一段字符串。

3.3 签名(Signature)

签名是通过一个秘钥和标头中提供的算法再将标头和载荷进行加工后生成的一段字符串。例如：

4. JWT 的认证流程

用户点击登录，后台接收用户请求并根据账号和密码从数据库查询用户信息。用户若存在，则使用 JWT 生成 token 并返回给前台。用户若不存在，则返回错误信息。
前端在请求其他资源时将 token 放到请求头中。
后台从请求头中获取 token 信息，如果 token 校验失败，则返回错误信息。如果校验成功，就将业务数据返回给前端。

5. JWT 的使用

本节参考(5及以后内容请看)：来来来，咱们聊一下 JWT

更多细节：IT老齐学习笔记-JWT篇_jwt设置有效期_ShawshanLin的博客-CSDN博客

HTTP协议示例

链路层-本地帧头部

链路层-IP协议头部

运输层-TCP协议头部

应用层-HTTP协议头部

TCP协议格式

小结：

网络组成部分：由主机、路由器、交换机等组成
网络结构：网络的网络
信息交换方式：电路交换和分组交换
网络分层：分清职责，物理层、链路层、网络层、运输层和应用层
网络协议：标头和载荷

04 Web 应用

HTTP 协议

HTTP基于TCP/IP通信协议来传递数据（HTML文件，图片文件、查询结果等）。它不涉及数据包（packet）传输，主要规定了客户端和服务器之间的通信格式，默认使用80端口。

1、特点：

（1）无连接：无连接是指限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接。这种方式可以节省传输时间。

（2）无状态：HTTP协议自身不对请求和响应之间的通信状态进行保存，任何两次请求之间都没有依赖关系。（每次请求都是独立的，与前面的请求和后面的请求都没有直接联系。协议本身不保留之前一切的请求或响应报文的信息。）

2、HTTP报文

来自：HTTP及其版本(HTTP1.0、HTTP1.1、HTTP2.0、HTTP3.0)详解_星河梦~的博客-CSDN博客

3、HTTP请求方法

来自：http常用请求方式及发起请求方法总结_httpget发送请求_星河梦~的博客-CSDN博客

请求方式

方法	描述
GET	请求指定的页面信息，并返回实体主题
HEAD	类似于GET请求，只不过返回的响应中没有具体的内容，用于获取报头
POST	向指定资源提交数据进行处理请求(例如提交表单或者上传文件)。数据被包含在请求体中。POST 请求可能会导致新的资源的建立和或已有资源的修改
PUT	从客户端向服务器传送的数据取代指定的文档的内容
DELETE	请求服务器删除指定的页面
CONNECT	HTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器
OPTIONS	允许客户端查看服务器的性能
TRACE	回显服务器收到的请求，主要用于测试或诊断
PATCH	对PUT方法的补充，用来对已知资源进行局部更新

对前五种的详解：

GET

请求指定页面的信息，并返回实体主体。

（1）get请求将请求参数包含在url中，例如：http://localhost:8001/index?username=小文&password=123456

利用request.query.参数名来获取get方式请求的参数

?之前的内容是请求文件的地址

username和password是请求参数

&是参数之间的分隔符

（2）GET请求是可以缓存的，我们可以从浏览器历史记录中查找到GET请求，还可以把它收藏到书签中

（3）且GET请求有长度限制，仅用于请求数据(不修改)

（4）只能通过url进行编码

（5）不安全，不能用来传递敏感信息

POST

用于将数据发送到服务器以创建或更新资源。

（1）post请求将请求参数保存在request body中，利用request.body.参数名来获取post方式请求的参数

（2）POST请求永远不会被缓存，且对数据长度没有限制

（3）我们无法从浏览器历史记录中查找到POST请求

（4）支持多种编码格式

（5）更安全，适合传递敏感信息

DELETE

用来删除指定的资源，它会删除目标资源的所有当前内容。（用于删除）

PUT

用于将数据发送到服务器以创建或更新资源，它可以用上传的内容替换目标资源中的所有当前内容。（用于更新）

HEAD

与GET方法相同，但没有响应体，仅传输状态行和标题部分。这对于恢复相应头部编写的元数据非常有用，而无需传输整个内容。

4、HTTP状态码

HTTP状态码是服务器返回给客户端的，其核心作用是web服务器来告诉客户端，当前网页发生的什么事，或者说当前web服务器的响应状态。所以HTTP状态码常用来判断和分析当前web服务器的运行状况。

在此介绍7种常见的状态码：

状态码200：状态码200表示服务器响应成功，也就是服务器找到了客户端请求的内容，并且将内容返回给客户端。

状态码302：状态码302代表临时跳转。例如：URL地址A可以向URL地址B上跳转，但这并不是永久性的，在经过一段时间后，URL地址A还可能向URL地址C上跳转。

状态码301 ：状态码301和状态码302相似，不同的是状态码301往往代表的是永久性的重定向，值得注意的是，这种重定向跳转，从严格意义来讲不是服务器跳转，而是客户端跳转的。这个“跳”的动作是服务器是通过回传状态码301来下达给客户端的，让客户端完成跳转。

状态码304：服务器通过返回状态码304可以告诉客户端请求资源成功，但是这个资源不是由服务器提供返回给客户端的，而是客户端本地浏览器缓存中就有的这个资源，因为可以从缓存中获取这个资源，从而节省传输的开销。

状态码403：状态码403代表请求的服务器资源权限不够，也就是说，没有权限去访问服务器的资源，或者请求的IP地址被封掉了。

状态码404：状态码404代表服务器上没有该资源，或者说服务器找不到客户端请求的资源，是最常见的请求错误码。

状态码500：状态码500代表程序错误，也就是说请求的网页程序本身报错了。在服务器端的网页程序出错。由于现在的浏览器都会对状态码500做一定的处理，所以在一般情况下会返回一个定制的错误页面。

5、HTTP版本

HTTP1

HTTP使用了典型的请求-响应模型，这样连接的网络利用率不高，无法在一条连接上进行多路复用，在一个完整请求中插入另一个请求，会导致 HTTP 无法分辨。请求头部和响应头部也会有很多重复（例如cookie），无形间增加报文的体积。

HTTP1.0：第一种模型，默认使用 Connection:cloose，浏览器每次请求都需要与服务器建立一个 TCP 连接，服务器处理完成后立即断开 TCP 连接（无连接），服务器不跟踪每个客户端也不记录过去的请求（无状态）过于浪费且效率低 HTTP1.1：第二种模型，默认使用 Connection:keep-alive（长连接），避免了连接建立和释放的开销；通过 Content-Length 字段来判断当前请求的数据是否已经全部接受。不允许同时存在两个并行的响应。这种模型解决了重复建立连接的问题，但还存在队头堵塞(Head of Line Blocking) 的问题，导致资源浪费
第三种模型：效率不高，因其不能解决队头堵塞和潜在的安全问题，现实中不会用该方案

HTTP2：帧

前三个字节：载荷长度

第四个字节：类型

第五个字节：类型对应的Flags

第六到第九字节：第1位保留位第2-32位：流ID

随后的8192字节：载荷

该模型解决了多路复用和队头堵塞问题，还带来了几个新特性：

（1）二进制传输

http2.0将请求和响应数据分割为更小的帧，并且它们采用二进制编码(http1.0基于文本格式)。多个帧之间可以乱序发送，根据帧首部的流表示可以重新组装。

（2）Header压缩

Http2.0开发了专门的“HPACK”算法，大大压缩了Header信息。

（3）多路复用

http2.0中引入了多路复用技术，很好的解决了浏览器限制同一个域名下的请求数量的问题。

多路复用技术可以只通过一个TCP链接就可以传输所有的请求数据。

（4）服务端推送

HTTP2.0在一定程度上改不了传统的“请求-应答”工作模式，服务器不再完全被动地响应请求，也可以新建“流”主动向客户端发送消息。（例如，浏览器在刚请求html的时候就提前把可能会用到的JS，CSS文件发送给客户端，减少等待延迟，这被称为“服务端推送Server Push”）

服务器也不能随便将第三方资源推送给服务器，必须经过双方确认。

HTTP2.0缺点：

（1）TCP以及TCP+TLS建立连接的延迟 （握手延迟）

（2）TCP的队头阻塞没有彻底解决（http2.0中，多个请求是跑在一个TCP管道中的，一旦丢包，TCP就要等待重传（丢失的包等待重新传输确认），从而阻塞该TCP连接中的所有请求）

因为HTTP2.0存在这些缺点，所以出现了HTTP3.0。

HTTP3：QUIC

Quick UDP Internet Connection
现存网络设备对TCP和UDP支持已经僵化
UDP不靠谱但是QUIC靠谱
QUIC可以为除HTTP协议以外的应用层协议提供支持

基于UDP协议的“QUIC”协议，让HTTP跑在QUIC上而不是TCP上。从而产生了HTTP3.0版本，它解决了“队头阻塞” 的问题。

特点：

（1）实现了类似TCP的流量控制，传输可靠性的功能。

（2）实现了快速握手功能（QUIC基于UDP，UDP是面向无连接的，不需要握手和挥手，比TCP快）

（3）集成了TLS加密功能

（4）多路复用，彻底解决TCP中队头阻塞的问题（单个“流”是有序的，可能会因为丢包而阻塞，但是其他流不会受到影响）

CDN

来自：cloud.tencent.com/developer/a…

CDN的全称是Content Delivery Network，即内容分发网络。

CDN是构建在现有网络基础之上的智能虚拟网络，依靠部署在各地的边缘服务器

通过中心平台的负载均衡、内容分发、调度等功能模块，使用户就近获取所需内容，降低网络拥塞，提高用户访问响应速度和命中率。

CDN的关键技术主要有内容存储和分发技术

属性：一种新型网络构建方式

目的：传输的更快、更稳定

基本原理

CDN的基本原理是广泛采用各种缓存服务器，将这些缓存服务器分布到用户访问相对集中的地区或网络中

在用户访问网站时，利用全局负载技术将用户的访问指向距离最近的工作正常的缓存服务器上，由缓存服务器直接响应用户请求。

CDN的基本思路是尽可能避开互联网上有可能影响数据传输速度和稳定性的瓶颈和环节，使内容传输的更快、更稳定。

通过在网络各处放置节点服务器所构成的在现有的互联网基础之上的一层智能虚拟网络

CDN系统能够实时地根据网络流量和各节点的连接、负载状况以及到用户的距离和响应时间等综合信息将用户的请求重新导向离用户最近的服务节点上。

其目的是使用户可就近取得所需内容，解决 Internet网络拥挤的状况，提高用户访问网站的响应速度。

简单来说，CDN就是一个分布式的缓存服务器，存着非常多文件，并且分布在世界各地，每个人都能就近访问

WebSocket

有状态的持久连接
服务端可以主动推送消息
用WebSocket发送消息延迟比HTTP低

1、什么是WebSocket

来自：WebSocket_ohana!的博客-CSDN博客

WebSocket是HTML5下一种新的协议（websocket协议本质上是一个基于tcp的协议）
它实现了浏览器与服务器全双工通信，能更好的节省服务器资源和带宽并达到实时通讯的目的
Websocket是一个持久化的协议

2、WebSocket原理

websocket约定了一个通信的规范，通过一个握手的机制，客户端和服务器之间能建立一个类似tcp的连接，从而方便它们之间的通信
在websocket出现之前，web交互一般是基于http协议的短连接或者长连接
websocket是一种全新的协议，不属于http无状态协议，协议名为"ws"

3、WebSocket与HTTP的关系

相同点

都是基于tcp的，都是可靠性传输协议
都是应用层协议

不同点

WebSocket是双向通信协议，模拟Socket协议，可以双向发送或接受信息
HTTP是单向的
WebSocket是需要浏览器和服务器握手进行建立连接的
而http是浏览器发起向服务器的连接，服务器预先并不知道这个连接

联系

WebSocket在建立握手时，数据是通过HTTP传输的。但是建立之后，在真正传输时候是不需要HTTP协议的

总结（总体过程）

首先，客户端发起http请求，经过3次握手后，建立起TCP连接；http请求里存放WebSocket支持的版本号等信息，如：Upgrade、Connection、WebSocket-Version等；
然后，服务器收到客户端的握手请求后，同样采用HTTP协议回馈数据；
最后，客户端收到连接成功的消息后，开始借助于TCP传输信道进行全双工通信。

小结：

HTTP123的演进历史
CDN解决了HTTP协议之外的问题
WebSocket从HTTP协议升级而来

05 网络安全

在明文的世界里说悄悄话

三要素

机密性:攻击者无法获知通信内容
完整性:攻击者对内容进行篡改时能被发现
身份验证:攻击者无法伪装成通信双方的任意一方与另一方通信

对称加密和非对称加密

对称加密:加密、解密用同样的密钥
非对称加密:加密、解密使用不同的密钥(公钥和私钥)，而且公钥加密只能用私钥解密、私钥加密只能用公钥解密

密码散列函数（哈希函数）

输入:任意长度的内容
输出:固定长度的哈希值
性质:找到两个不同的输入使之经过密码散列函数后有相同的哈希值,在计算上是不可能的

机密性

加密需要加密算法和密钥等信息(统称为秘密信息)
网络是明文的，不安全

完整性和身份验证

完整性和身份验证相互关联

蟹老板向银行发起了转账请求
银行需要确认
- 这个请求真的是蟹老板发起的
- 目标账户和转账金额没有被篡改

如何实现机密性

已知:网络是明文的
如果双方可以通过明文通信商量出秘密信息，那么攻击者也可以
所以想要通过明文通信交换秘密信息，通信双方需要先有秘密信息

如何实现完整性

密码散列函数性质:找到两个不同的输入使之经过密码散列函数后有相同的哈希值，在计算上是不可能的
有明文m,密码散列函数H
计算H(m)获得哈希值h
将m和h组合成新信息m+h
接收方拆分m + h，重新计算H(m)得h’，对比h’和h

但还是很容易被篡改，所以想要实现完整性，通信双方需要先有秘密信息

有明文m，密码散列函数H，以及一个密钥s
计算H(m+s)获得哈希值h
将m和h组合成新信息m+ h
接收方拆分m +h，重新计算H(m+ s)得h'，对比h'和h

如何实现身份验证

签名:用于鉴别身份和防止伪造
非对称加密性质:加密、解密使用不同的密钥(公钥和私钥) ,而且公钥加密只能用私钥解密、私钥加密只能用公钥解密
蟹老板用自己的私钥对信件进行加密，并发送给海绵宝宝
海绵宝宝使用蟹老板的公钥进行解密，获得原文
保证了机密性、完整性和身份验证

数字签名:对明文内容的哈希值使用私钥加密，验证者使用公钥验证
数字签名(指纹) = 私钥加密(密码散列函数(原文) )
消息=原文+数字签名
一般用于对公开内容(如包含公钥的证书)进行数字签名，防止篡改
可信的人验证蟹老板的公钥
那谁验证可信的人的公钥?
根证书是证书链的尽头
验证的一连串证书称为证书链
分发证书、验证证书的基础设施称为PKI， Public Key Infrastructure
所以想要实现身份验证，通信双方需要先有秘密信息，即根证书中的公钥

HTTPS

把HTTP的明文换成密文，再验证身份，即HTTPS

HTTPS = HTTP + TLS

TLS=身份验证+加解密

身份验证靠PKI

服务端身份验证靠PKI，客户端身份验证靠HTTP协议。

资料

http2：web.dev/performance…

http3：calendar.perfplanet.com/2020/head-o…

前端初阶训练营与计算机网络 ｜ 青训营笔记