前端与HTML | 青训营笔记活动

96 阅读20分钟

第一章:计算机网络概论

分析方法

  • 自底向上

    • 从简单开始,逐渐变复杂
    • 将模块逐步拼凑成一个系统
  • 自顶向下

    • 从复杂开始,逐渐变简单
    • 从复杂的系统问题入手,拆分为模块问题

蟹堡王帝国

蟹堡王顾客:客户端

蟹堡王分店:服务端

小区转发点和蟹堡王城市转发分店:路由器

转发表格:协议

计算机网络基础

网络组成部分

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

网络结构:网络的网络

  • 比奇堡和小区网络:本地网络

本地网络(Local Area Network,简称 LAN)是指一个相对较小的地理范围内(例如家庭、学校、公司或办公楼)的计算机和其他设备通过网络媒介相互连接的系统。本地网络的主要目的是实现这些设备间的资源共享、数据传输和通信。

本地网络的特点包括:

  1. 范围有限:通常覆盖一个较小的地理区域,如同一栋建筑物或一个园区。
  2. 高速传输:相较于广域网(WAN),本地网络内的数据传输速度通常较快。
  3. 私有所有:本地网络通常由组织或个人拥有和管理。
  4. 设备多样:本地网络内可能包括计算机、打印机、服务器、网络存储设备等各种设备。
  5. 通信协议:本地网络通常使用 Ethernet(以太网)或 Wi-Fi(无线局域网)作为通信协议。

使用本地网络的好处包括便捷地共享资源(如打印机、文件和应用程序)、降低通信成本、提高工作效率和便于设备之间的协作。

  • 北京和上海分店+比奇堡:三个本地网络节点的网络

本地网络节点(Local Network Node)是指在本地网络(LAN)中的一个设备,例如计算机、服务器、打印机或路由器等。每个节点在网络中都有一个唯一的地址,通常称为IP地址。这个地址用于在网络中识别和定位特定的设备。在数据传输过程中,这些地址会帮助网络设备将信息发送到正确的目的地。

本地网络节点之间的通信通常通过交换机(Switch)或路由器(Router)实现。交换机主要负责在同一局域网内设备之间转发数据包,而路由器主要负责在不同网络之间转发数据包,如在本地网络和互联网之间。

在本地网络内,节点之间可以通过有线(如以太网)或无线(如Wi-Fi)连接相互通信。使用有线连接时,设备之间通过网线连接,传输速度较快且稳定;而无线连接则无需网线,更加便捷,但可能受到环境因素影响,导致传输速度波动。

  • 全国通信网络:本地网络的网络

在一个大型组织或企业环境中,通常会使用子网划分(subnetting)对本地网络进行划分。子网划分的目的是将一个大的网络划分为多个较小的子网络,以实现更好的网络管理、降低网络拥塞和提高安全性。这些子网络可以根据部门、地理位置或功能进行划分。

子网划分是通过对IP地址进行按位与操作来实现的。使用子网掩码(subnet mask)可以确定一个IP地址属于哪个子网。在子网划分后,同一子网内的设备可以直接通信,而跨子网通信需要通过路由器(router)实现。

总结一下,在一个本地网络(LAN)中,可以根据实际需求将其划分为多个子网络。这些子网络有助于实现更有效的网络管理、提高安全性和降低网络拥塞。

  • 区域网络、城域网和广域网
  1. 区域网络(Metropolitan Area Network,简称 MAN):区域网络覆盖一个城市或城市群,比本地网络(LAN)的范围更大,但比广域网(WAN)小。典型的应用场景包括连接同一城市内的多个企业办公楼、大学校园、政府机构等。区域网络通常使用高速光纤或其他高速传输介质,可以提供较高的数据传输速率。
  2. 城域网(Campus Area Network,简称 CAN):城域网是指覆盖一个学校、大学或企业园区范围内的计算机网络。城域网的规模介于本地网络(LAN)和区域网络(MAN)之间。城域网通常由多个相互连接的局域网组成,以实现资源共享、通信和数据传输。城域网可以使用有线(如以太网)和无线(如 Wi-Fi)连接。
  3. 广域网(Wide Area Network,简称 WAN):广域网覆盖一个很大的地理区域,如国家、地区甚至全球。广域网通过远程通信链路和中继设备连接多个本地网络、区域网络和城域网。典型的广域网应用包括互联网、电话公司的网络和大型企业的全球网络。广域网的数据传输速率通常较低,因为它们需要跨越更大的距离并涉及更多的中继设备。

电路交换&分组交换

电路交换和分组交换是两种不同的网络通信技术。它们在传输数据时采用不同的方法和机制。

  1. 电路交换(Circuit Switching): 电路交换最早用于电话系统,主要用于语音通信。在电路交换中,通信双方之间建立一条固定的、专用的物理通信路径。在通话过程中,这条路径会一直被保留,直到通话结束。数据沿着这条路径顺序传输。

电路交换的主要特点和缺点如下:

  • 确保了连续性:由于通信双方之间有一条专用的通信路径,因此数据传输具有连续性和实时性,适用于实时通信,如电话通话。
  • 低效:在通信过程中,即使没有数据传输,通信路径也会一直被占用。这可能导致资源浪费,尤其在数据传输量不大的情况下。
  • 通话建立时间较长:在建立通话之前,需要为通信双方分配一条物理路径,这个过程可能需要较长的时间。
  1. 分组交换(Packet Switching): 分组交换是现代计算机网络(如互联网)中主要使用的通信技术。在分组交换中,数据被切分成多个数据包(或称分组),每个数据包独立传输。数据包在网络中根据最佳路由选择相应的路径,最终在目的地重新组装成原始数据。

分组交换的主要特点和优点如下:

  • 高效:数据包在网络中独立传输,可以根据网络拥塞情况动态选择最佳路径。这样可以实现更高效的资源利用和更快的数据传输速率。
  • 弹性:由于数据包可以通过不同的路径传输,因此分组交换网络具有较强的抗干扰能力和容错性。
  • 适用于多种应用:分组交换可以处理多种类型的数据(如文本、图像、音频和视频),非常适合复杂的计算机网络应用。

电路交换和分组交换是两种截然不同的通信技术。电路交换主要用于实时通信,如电话系统,而分组交换则广泛应用于现代计算机网络,如互联网。分组交换具有更高的资源利用率和更强的适应性,因此在大多数场景下,分组交换是更优的选择

网络分层

  1. 网络层(Network Layer): 网络层与 OSI 模型中的网络层相同,负责处理网络寻址和路由选择,以确定数据包从源节点到目的节点的最佳路径。
  2. 传输层(Transport Layer): 传输层与 OSI 模型中的传输层相同,负责提供端到端的通信服务,包括数据的分段、传输、重组和确认。传输层还负责处理流量控制和差错控制。
  3. 应用层(Application Layer): 这个层次结合了 OSI 模型中的会话层、表示层和应用层,负责处理与特定应用程序相关的通信任务,以及数据的表示和编码问题。
  • 快递员(快递公司类比应用层)不关心包裹内容
  • 卡车司机(类比传输层)不关心车厢里拉的是什么
  • 高速公路(类比网络层)不关心开的什么车

网络协议

网络基础协议是指在计算机网络中实现各种功能的一组规定,这些规定描述了数据在网络中的传输方式、格式和处理过程,这里列出一些常见的计算机网络协议

协议的存在依赖于连接

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

标头和载荷

在计算机网络中,数据通常按照协议的格式进行封装和传输。一个数据包或帧通常分为两部分:标头(Header)和载荷(Payload)。标头和载荷分别承担不同的作用,共同实现数据在网络中的传输和处理。

  1. 标头(Header): 标头是数据包或帧的开头部分,包含了用于处理和传输数据的控制信息。标头中的信息根据不同的协议和网络层次而有所不同。一般来说,标头包含了如下信息:

  2. 载荷(Payload): 载荷是数据包或帧的主体部分,包含了实际要传输的数据。载荷的内容根据不同的应用和场景而有所不同。例如,在传输文件时,载荷中包含了文件的内容;在传输网页时,载荷中包含了 HTML、CSS 和 JavaScript 等网页元素。

  • HTTP协议示例:应用层-HTTP协议头部

HTTP(超文本传输协议)是应用层的一个协议,用于在客户端(如浏览器)和服务器之间传输超文本和其他资源。HTTP 协议的请求和响应消息都包含头部(Header)信息,用于描述和控制消息的传输和处理

小结

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

Web中的网络

HTTP1

请求

  • 请求行(Request Line):GET /index.html HTTP/1.1。请求行包含了请求方法(GET)、请求资源的路径(/index.html)和 HTTP 协议版本(HTTP/1.1)。
  • Host:www.example.com。Host 头部指定了请求的目标服务器域名。
  • User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/58.0.3029.110 Safari/537.36。User-Agent 头部描述了发起请求的客户端(浏览器)的信息,包括操作系统、浏览器类型和版本等。
  • Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8。Accept 头部表示客户端支持接收的 MIME 类型。在这个示例中,客户端支持接收 HTML、XHTML、XML 和 WebP 等格式的内容。
  • Accept-Language:en-US,en;q=0.5。Accept-Language 头部表示客户端支持的语言和优先级。在这个示例中,客户端优先支持美国英语,其次是其他英语。
  • Connection:keep-alive。Connection 头部表示连接的控制选项。在这个示例中,keep-alive 表示客户端希望保持连接,以便在多个请求之间复用 TCP 连接。

响应

HTTP 协议中的响应是服务器针对客户端请求所作出的回应。响应消息包含状态行、响应头部和响应体三部分。以下是一个简化的 HTTP 响应示例:

  • 状态行(Status Line):HTTP/1.1 200 OK。状态行包含 HTTP 协议版本(HTTP/1.1)、状态码(200)和状态描述(OK)。状态码 200 表示请求已成功处理。
  • Date:Mon, 23 May 2022 22:38:34 GMT。Date 头部表示响应生成的日期和时间。
  • Server:Apache/2.4.1 (Unix)。Server 头部描述了生成响应的服务器软件和版本信息。
  • Content-Type:text/html; charset=UTF-8。Content-Type 头部指定了响应体的媒体类型(MIME 类型)和字符编码。在这个示例中,响应体的内容是 HTML 格式,字符编码为 UTF-8。
  • Content-Length:138。Content-Length 头部表示响应体的字节长度。
  • Last-Modified:Sun, 22 May 2022 15:28:12 GMT。Last-Modified 头部表示请求资源的最后修改时间。
  • Connection:close。Connection 头部表示连接的控制选项。在这个示例中,close 表示服务器在发送完响应后将关闭 TCP 连接。
  • 响应体(Response Body):响应体包含实际返回的数据,通常是 HTML、JSON、XML 等格式的内容。在这个示例中,响应体是一个简单的 HTML 页面。

HTTP连接模型

队头堵塞

HTTP1.1:无法多路复用

HTTP/1.1 无法实现多路复用的主要原因是其基于文本的请求和响应格式以及协议设计。在 HTTP/1.1 中,每个请求和响应都是一个完整的文本消息,必须按照顺序发送和接收。这导致了一种称为“队头阻塞”(Head-of-Line Blocking)的问题,即一个请求或响应的处理延迟会影响后续的请求和响应,无法并行处理。虽然 HTTP/1.1 引入了管道化技术以尝试提高性能,但由于实际部署中的兼容性和实现问题,管道化并未广泛应用。

HTTP2的帧

多路复用连接模型: 在 HTTP/2 中,引入了多路复用(Multiplexing)连接模型。多路复用允许客户端和服务器在一个 TCP 连接上并行发送和接收多个请求和响应。HTTP/2 通过将请求和响应拆分为多个帧(Frame),并为每个请求分配一个独立的流(Stream)来实现多路复用。这种模型进一步提高了连接的利用率和性能,解决了 HTTP/1.1 管道化模型的问题。HTTP/2 还引入了其他优化措施,如头部压缩、服务器推送等,进一步提升了性能。

在 HTTP/2 中,帧(Frame)是协议的基本传输单位。HTTP/2 将请求和响应消息分解为多个小的二进制帧,这些帧在客户端和服务器之间传输。每种类型的帧都有特定的目的和格式。使用帧可以实现更高效的多路复用,避免队头阻塞问题,提高传输性能。

帧来带来的好处

  • 调整响应传输的优先级
  • 头部压缩
  • Server Push

HTTP3出现的原因是HTTP2还不够快和解决 HTTP/2 中仍然存在的一些问题和局限性

HTTP3:QUIC

  • Quick UDP Internet Connection
  • 现存网络设备对TCP和UDP支持已经僵化
  • UDP不靠谱(包丢了就不管了,业务给多少数据,它就发多少数据)但是QUIC靠谱
  • QU1C可以为除HTP协议以外的应用层协议提供支持

CDN

CDN:DNS劫持

  • 域名解析一般由网站自己处理
  • 要加速的域名则重定向到CDN厂商的域名解析服务处理(通常不是由自己来解析,而是由CDN厂商来做)
  • CDN厂商根据来源确定最近的CDN服务器的IP
  • 用户直接访问最近的CDN服务器

CDN(Content Delivery Network,内容分发网络)是一种用于优化网络资源访问速度和提高用户体验的技术。CDN 的核心思想是将网站或应用程序的内容(如图片、视频、脚本等)缓存到位于不同地理位置的服务器上,使用户可以从最近的服务器获取所需的内容,从而降低延迟、提高访问速度和可用性。

CDN 有两种基本的缓存策略:拉取策略(Pull)和推送策略(Push)。

拉取策略,也叫做就近访问策略,指的是 CDN 节点通过 HTTP 请求直接向源站请求数据,然后缓存到本地节点,当用户请求数据时,就直接从缓存的本地节点中获取数据。这种策略主要用于数据更新较少的情况,适用于流量较小、访问频率低的站点。

推送策略,也叫做预先访问策略,指的是将源站的数据推送到 CDN 节点,通过 HTTP 请求缓存到 CDN 节点,当用户请求数据时,直接从缓存的本地节点中获取数据。这种策略适用于数据更新频繁的情况(比如视频举例的热门新电影上线的时候,就可以使用推送策略,全国用户可以第一时间 获取新电影),可以有效地缓解源站的访问压力,提高用户访问速度。推送策略需要源站和 CDN 之间建立预先配置好的链接,源站通过这个链接将数据推送到 CDN 节点。

拉取策略和推送策略的优缺点如下:

拉取策略:

优点:

  1. 可以实时获取最新数据,不需要手动推送数据。
  2. 可以有效地缓解源站的访问压力,节省带宽和资源。
  3. 部署简单,不需要与源站建立链接。

缺点:

  1. 访问速度可能较慢,特别是在访问量较大时。
  2. 需要源站保持开放状态,以便 CDN 节点随时请求数据。

推送策略:

优点:

  1. 访问速度较快,因为数据已经预先推送到了 CDN 节点。
  2. 可以减轻源站的访问压力,提高网站的稳定性和可靠性。

缺点:

  1. 需要手动推送数据到 CDN 节点。
  2. 可能会出现数据不一致问题,需要定期同步数据。
  3. 部署和维护较为复杂,需要建立预先配置好的链接。

WebSocket

WebSocket 是一种网络通信协议,可以在客户端和服务器之间实现双向通信。与传统的 HTTP 协议不同,WebSocket 协议在客户端和服务器之间建立持久连接,可以在任何时间点双向通信,而不需要通过 HTTP 请求和响应来进行。WebSocket 协议可以在 Web 应用程序和服务器之间实现实时通信和数据传输,常用于在线游戏、聊天室、实时数据监测等场景。

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

小结

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

网络安全

网络安全:三要素

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

网络安全:对称加密和非对称加密

  • 对称加密:加密、解密用同样的密钥

对称加密算法是指使用同一个密钥进行加密和解密。发送方使用密钥将明文加密成密文,并将密文发送给接收方,接收方使用相同的密钥将密文解密成明文。对称加密算法具有加密和解密速度快、效率高的特点,但是密钥的安全性是关键问题,如果密钥泄露,则所有加密数据都会被破解。

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

非对称加密算法是指使用不同的密钥进行加密和解密。发送方使用公钥将明文加密成密文,并将密文发送给接收方,接收方使用私钥将密文解密成明文。因为公钥和私钥是不同的,所以非对称加密算法也称为公钥加密算法。公钥可以公开传播,而私钥只有接收方知道,这样可以保证密钥的安全性。

网络安全:密码散列函数(哈希函数)

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

网络安全:机密性

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

怎么在不安全的信道交换秘密信息?

网络安全:完整性和身份验证

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

  • 蟹老板向银行发起了转账请求

  • 银行需要确认

    • 这个请求真的是蟹老板发起的
    • 目标账户和转账金额没有被篡改

如何实现机密性

  • 已知:网络是明文的
  • 如果双方可以通过明文通信商量出秘密信息,那么攻击者也可以
  • 所以想要通过明文通信交换秘密信息,通信双方需要先有秘密信息,意思就是我们想要通过明文来交换密钥,就得有不会被攻击者知道的秘密信息

如何实现完整性

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

如何实现身份验证

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

小结

  • 网络安全三要素:机密性、完整性和身份验证

  • 在没有提前交换秘密信息的前提下,无法在不安全的信道交换秘密信息

  • PKI保证了普通用户不需要“面对面”和根证书机构交换根证书

  • HTTPS使用PKI完成了除客户端身份验证以外的特性,客户端身份验证靠

  • HTTP协议实现