moyin/fzu-product
1
0
Fork 0
Code Issues 1 Pull Requests Packages Projects Releases Wiki Activity

Merge pull request #133 from FallenYing/master

Browse Source 
chore: add
This commit is contained in:
LeiSure
2023-10-12 00:03:15 +08:00
committed by GitHub
parent 25f4df4489 1de121b461
commit 337cff4ca6
18 changed files with 277 additions and 264 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
7.网络应用开发/7.1.1.3附录1：前端介绍（详细版）.md
View File

@@ -1,22 +1,22 @@
# 附录 1：前端介绍（详细版）
### 前端的概念
## 前端的概念
前端，想要入门，则必须要知道他所指代的内容。
它分为狭义和广义。其中，广义其实是狭义的一个更深入的发展的结果。
狭义就是指网页，而广义则是指互联网中一切可见的界面及交互功能。设计师负责设计出好看的界面，而前端工程师则是负责把他实现，并在实现基础上增加交互的部分和实际的功能。例如：各种 GUI、小程序(各种)、快应用、APP 的界面、网页、鸿蒙应用等都可以由前端来完成。有些人可能会疑惑，这也算前端。我只能说，这就是大前端时代。许多人学习前端，在网上寻找教程，找到的教程都是非常远古或者基础的。由于前端的发展历史很长，教程也必须与时俱进。以前的教程仅限网页制作，但如今前端领域日新月异，各种新框架新功能不断开辟，我们不能都有所涉及，但也不能做井底之蛙。
狭义就是指网页，而广义则是指互联网中一切可见的界面及交互功能。设计师负责设计出好看的界面，而前端工程师则是负责把他实现，并在实现基础上增加交互的部分和实际的功能。例如：各种 GUI、小程序 (各种)、快应用、APP 的界面、网页、鸿蒙应用等都可以由前端来完成。有些人可能会疑惑，这也算前端。我只能说，这就是大前端时代。许多人学习前端，在网上寻找教程，找到的教程都是非常远古或者基础的。由于前端的发展历史很长，教程也必须与时俱进。以前的教程仅限网页制作，但如今前端领域日新月异，各种新框架新功能不断开辟，我们不能都有所涉及，但也不能做井底之蛙。
### 前端的学习
## 前端的学习
因此，想要入门前端，则必须先建立一个较好的世界观，才能进行方法论的学习。最最基础的前端，也就是网页，需要从网页三剑客开始学习，即 HTML、CSS、JAVASCRIPT。这三样一个负责描述网页内容，一个负责描述网页样式，一个负责网页交互。没错，这三个就是三门语言。每门语言都有不可忽视的发展成果。大多数人在网上寻找教程，找到的都是最基础的教程，甚至没有与时俱进，比如有许多废弃的规定还在教程中，比如有新的语法规范却没有教授。我这里并不推荐有没有什么好的教程，而是要大家通过搜索引擎的帮助，让自己建立一个正确的前端世界观，而这篇文章知识来帮助你们少走弯路和死胡同。当然，如果大家想要学好前端，必须要自己学会阅读文档，而不是一些教程。因为官方文档才是最前沿的，最正确的，最全面的。
### 前端的历史
## 前端的历史
从历史中较为全面的了解前端，可以帮助你快速建立相关的观念。当然，前端的历史，大家可以看看知乎上高赞的回答。我这里只说一下我的观念。前端在历史发展中，非常注重一个理念，不要重复造轮子（DRY）。没错，别人做好的，已经很完善的，拿来用就行，除非你自己还有什么其他的需求。这个观念与其他计算机领域的观念是不一样的。这也是前端能够快速发展的重要原因之一。浏览器等设备平台对代码进行一个渲染和执行，我们必须遵守这个规范。但代码怎么样写，怎么样提高效率，怎么样支持多种写法都能得到一样的效果，这就是前端发展的一个关键。先辈们对代码进行了二次的一个编译。先辈们建立了一系列编译器等操作，使得前端能够在基石上向上发展。我们不必一板一眼的编写非常冗余的 HTML\CSS\JS 代码，而是编写特定语法的代码，然后通过代码编译成浏览器等平台可识别的 HTML\CSS\JS\其他的代码。这不仅使得我们前端开发的效率大大提高，还能把代码移植到其他平台，实现跨平台的功能。所以这才诞生出了 postcss，vue，emmet 等高效而又实用的成果。
要说，前端为什么发展这么快，很重要的因素就是它非常热衷于开源。通过开源，大家可以一起维护一个项目，并通过传播，让其他人在它的基础上继续发展，逐渐壮大。你可以直接在前人的基础上继续发展，可以快速建立自己的生态，发现并合力解决各种 BUG。
MDN 是个适合初学和文档查阅的网站 里面有学习前端的全流程
https://developer.mozilla.org/zh-CN/docs/learn
<https://developer.mozilla.org/zh-CN/docs/learn>

14
7.网络应用开发/7.1.1.4附录2：大前端开发.md
View File

@@ -2,18 +2,18 @@
这里我们讲讲前端三剑客和前端框架
如下为roadmap上前端的路线
https://roadmap.sh/frontend
如下为 roadmap 上前端的路线
<https://roadmap.sh/frontend>
- 前端三剑客
- https://www.w3school.com.cn/html/html5_intro.asp
- https://www.w3school.com.cn/css/index.asp
- https://www.w3school.com.cn/js/index.asp
- <https://www.w3school.com.cn/html/html5_intro.asp>
- <https://www.w3school.com.cn/css/index.asp>
- <https://www.w3school.com.cn/js/index.asp>
- 前端框架
- https://cn.vuejs.org/
- <https://cn.vuejs.org/>
> 在官方文档学习 Vue 的过程中，强烈建议你在左上角 `API风格偏好` 中，改为组合式
- https://zh-hans.react.dev/
- <https://zh-hans.react.dev/>
> 在官方文档学习 React 的过程中，强烈建议不要在 Class 写法停留太久，要速速学习 Hook 写法

176
7.网络应用开发/7.1.1.5附录3：跨端开发.md
View File

@@ -1,30 +1,31 @@
# 附录 3：跨端开发
> 人文 + 技术 + 经验
> author： 少轻狂
>
> author：少轻狂
## 何为跨端：孙行者、者行孙
简单来说，就是一套代码，能在多个平台上跑。
> 孙行者，行者孙，者孙行.......者行孙，孙者行，行孙者
例如，你可以编写一套前端代码，然后在Web、HarmonyOS、OpenHarmony、Android、Ios、Macos、Linux、Windows、小程序（微信、QQ、抖音、支付宝...）上运行。
例如，你可以编写一套前端代码，然后在 Web、HarmonyOS、OpenHarmony、Android、Ios、Macos、Linux、Windows、小程序（微信、QQ、抖音、支付宝...）上运行。
## 为何跨端：三生三世皆为你
随着业务的发展，产生了越来越多的业务场景，同时随着技术的发展，产生了 越来越多的端，PC 端(Windows、Mac) ，移动端(安卓、iOs)、web端、loT 设备(车载设备、手表)等。
随着业务的发展，产生了越来越多的业务场景，同时随着技术的发展，产生了 越来越多的端，PC 端 (Windows、Mac) ，移动端 (安卓、iOs)、web 端、loT 设备 (车载设备、手表) 等。
但是，很多互联网企业制作应用时，往往需要使应用支持多个系统，但是每个系统的应用功能也需保持一致。为此，传统做法是各端安排研发人员进行开发相同功能。这不仅造成了资源冗余、浪费，开发、维护的成本也特别高。通常情况下，开发的周期也是比较长的。
新兴企业往往难以投入很多人力、资金到这部分。他们往往喜欢一个岗位干多份事情：既让你会app开发，又要你开发小程序，web页面，还要让你自己干全栈。
新兴企业往往难以投入很多人力、资金到这部分。他们往往喜欢一个岗位干多份事情：既让你会 app 开发，又要你开发小程序，web 页面，还要让你自己干全栈。
这时候，跨端就很好的解决了这方面的难题。
在现代化前端发展的过程中，跨端领域也正逐渐火热。
就比方说，现如今，桌面端QQ已经全面基于前端跨端方式开发，例如MacOS QQ、Linux QQ、Win QQ（还在内测）。
就比方说，现如今，桌面端 QQ 已经全面基于前端跨端方式开发，例如 MacOS QQ、Linux QQ、Win QQ（还在内测）。
我们市场上也能看到很多耳熟能详的应用他们都是基于前端跨端开发的：Steam桌面版、钉钉、VsCode等。
我们市场上也能看到很多耳熟能详的应用他们都是基于前端跨端开发的：Steam 桌面版、钉钉、VsCode 等。
## 优点
@@ -33,47 +34,50 @@
3. 动态化：支持动态化下发，满足日益增长的业务需求
## 如何跨端：港通天下
跨端其实不是一个新兴的名词。跨端又称跨平台。这其实很多语言都非常崇拜跨平台概念，原生支持跨平台。例如JAVA语言，它不仅可以开发安卓应用、其他操作系统的应用都可以开发。例如微软的.NET，为跨平台而生。
跨端其实不是一个新兴的名词。跨端又称跨平台。这其实很多语言都非常崇拜跨平台概念，原生支持跨平台。例如 JAVA 语言，它不仅可以开发安卓应用、其他操作系统的应用都可以开发。例如微软的.NET，为跨平台而生。
那么，前端如何实现的跨端呢？
当你问这个问题的时候，是否注意到一件事：web前端原本就是跨平台的，跨端的。我们编写一套前端网页的代码，然后这个网页就能够通过手机各种系统、电脑各种系统通过浏览器访问。这不就已经跨平台、跨端了嘛？
当你问这个问题的时候，是否注意到一件事：web 前端原本就是跨平台的，跨端的。我们编写一套前端网页的代码，然后这个网页就能够通过手机各种系统、电脑各种系统通过浏览器访问。这不就已经跨平台、跨端了嘛？
是不是很奇妙？欸，这时候又有小伙伴要问了：那既然已经实现了跨端，那下面的内容不就没啥用了吗，我们为啥要学跨端呢？
其实不然。浏览器在移动设备上岂能和App相比。对于企业来说，一个App相比于网站，更能让用户产生粘性，留住用户，提高市场占有率。这就像移动端的哔哩哔哩，硬是要你用他家的App，否则就没有优秀的体验可言。
其实不然。浏览器在移动设备上岂能和 App 相比。对于企业来说，一个 App 相比于网站，更能让用户产生粘性，留住用户，提高市场占有率。这就像移动端的哔哩哔哩，硬是要你用他家的 App，否则就没有优秀的体验可言。
废话不多说，来看看主要技术方案。
## 方案简述
如果，让你思考如何让web代码支持跨平台，你会怎么做呢？
如果，让你思考如何让 web 代码支持跨平台，你会怎么做呢？
以下是简单的思路：
1. 各个平台的容器能够运行这一套web代码。
2. web代码编译成各个平台能使用的代码，然后再编译成相应软件。
1. 各个平台的容器能够运行这一套 web 代码。
2. web 代码编译成各个平台能使用的代码，然后再编译成相应软件。
3. ...
现有的技术方案如下：
| 技术方案 | 视图层 | 优点 | 缺点 | 实践 |
| ------------ | ---------------- | --------------------------------------------------------------------- | ---------------------------------------------------- | -------------------------------- |
| hybrid方案 | webview | 1. 开发成本低<br />2. CSS全集<br />3. 一致性好<br />4. 生态最好<br /> | 1. 性能中等<br > | 1. 浏览器<br />2. Electron<br /> |
| 原生渲染方案 | 原生组件 | 1. 性能好<br /> | 1. CSS子集<br />2. 一致性一般<br /> | 1. React Native<br /> |
| 自渲染方案 | Skia | 1. 性能最好<br />2. 一致性最好<br /> | 1. CSS子集<br />2. 开发成本高<br />3. 生态一般<br /> | 1. Flutter<br /> |
| 小程序方案 | webview+原生组件 | 1. 开发成本低<br />2. CSS全集<br />3. 一致性好<br /> | 1. 生态一般<br /> | 1. 微信小程序<br /> |
| hybrid 方案 | webview | 1. 开发成本低<br />2. CSS 全集<br />3. 一致性好<br />4. 生态最好<br /> | 1. 性能中等<br > | 1. 浏览器<br />2. Electron<br /> |
| 原生渲染方案 | 原生组件 | 1. 性能好<br /> | 1. CSS 子集<br />2. 一致性一般<br /> | 1. React Native<br /> |
| 自渲染方案 | Skia | 1. 性能最好<br />2. 一致性最好<br /> | 1. CSS 子集<br />2. 开发成本高<br />3. 生态一般<br /> | 1. Flutter<br /> |
| 小程序方案 | webview+ 原生组件 | 1. 开发成本低<br />2. CSS 全集<br />3. 一致性好<br /> | 1. 生态一般<br /> | 1. 微信小程序<br /> |
### Hybrid 方案
### Hybrid方案
简单理解，就是浏览器套壳。
它是基于WebView渲染，通过JS Bridge 把一部分系统能力开放给JS调用。
它是基于 WebView 渲染，通过 JS Bridge 把一部分系统能力开放给 JS 调用。
![](https://cdn.xyxsw.site/235436487dsfhtwuytjyfj.png)
WebView容器的工作原理是基于Web技术来实现界面和功能，通过将原生的接口封装、暴露给JavaScript调用，JavaScript编写的页面可以运行在系统自带的WebView中。这样做的优势是，对于前端开发者比较友好，可以很快地实现页面跨端，同时保留调用**原生的能力**，通过搭建桥接层和原生能力打通。但这种设计，跨端的能力受限于桥接层，当调用之前没有的原生能力时，就需要增加桥。另外，浏览器内核的渲染独立于系统组件，无法保证原生体验，**渲染的效果会差不少**。
WebView 容器的工作原理是基于 Web 技术来实现界面和功能，通过将原生的接口封装、暴露给 JavaScript 调用，JavaScript 编写的页面可以运行在系统自带的 WebView 中。这样做的优势是，对于前端开发者比较友好，可以很快地实现页面跨端，同时保留调用**原生的能力**，通过搭建桥接层和原生能力打通。但这种设计，跨端的能力受限于桥接层，当调用之前没有的原生能力时，就需要增加桥。另外，浏览器内核的渲染独立于系统组件，无法保证原生体验，**渲染的效果会差不少**。
#### 浏览器
浏览器就是一种历史悠久的跨平台方案。
网页跨平台不意味着浏览器也是跨平台的，浏览器的可执行文件还是每个平台单独开发和编译的，但是他们支持的网页解析逻辑一样，这样上面跑的网页就是跨平台的。
@@ -83,18 +87,21 @@ WebView容器的工作原理是基于Web技术来实现界面和功能，通过
![](https://cdn.xyxsw.site/fdegetyjyrj.png)
#### PWA
尽管PWA的出现不是为了“跨端”，但他们对于“跨端”的天然支持，能够让一套代码运行在PC、移动两端，就再一次产生了跨端设计实施的可能性。
尽管 PWA 的出现不是为了“跨端”，但他们对于“跨端”的天然支持，能够让一套代码运行在 PC、移动两端，就再一次产生了跨端设计实施的可能性。
> 小程序的“鼻祖“，但如今在国内已消亡。
PWA（Progressive Web App）是一个基于web技术构建的应用，并具备了像原生应用一样的体验、性能以及功能。它通过使用Service Worker缓存静态资源实现离线可访问，提高网页加载速度并且通过添加到主屏幕来给用户带来更好的体验。
PWA（Progressive Web App）是一个基于 web 技术构建的应用，并具备了像原生应用一样的体验、性能以及功能。它通过使用 Service Worker 缓存静态资源实现离线可访问，提高网页加载速度并且通过添加到主屏幕来给用户带来更好的体验。
PWA 是 Google 于 2016 年提出的概念，于 2017 年正式落地，于 2018 年迎来重大突破，全球顶级的浏览器厂商，Google、Microsoft、Apple 已经全数宣布支持 PWA 技术。
纵观现有 Web 应用与原生应用的对比差距，如**离线缓存、沉浸式体验**等等，可以通过已经实现的 Web 技术去弥补这些差距，最终达到与原生应用相近的用户体验效果。
**PWA=WEB网页+离线缓存+消息推送**
**PWA=WEB 网页 + 离线缓存 + 消息推送**
> 在 2017 年 7 月 5 日“百度 AI 开发者大会”（Baidu Create2017）——Web 生态分论坛上，百度开发者介绍了百度 Lavas 解决方案，帮助开发者快速搭建 PWA 应用。
> lavas 不是一个框架，而是一个基于 vue 的 PWA 解决方案，通过 lavas 导出的模板帮助开发者解决了接入 PWA 过程中遇到的问题：
>
> - Service Worker 生成
> - Service Worker 更新，以及 sw 更新后的操作
> - App Skeleton，页面渲染完成之前的页面框架
@@ -102,92 +109,100 @@ PWA 是 Google 于 2016 年提出的概念，于 2017 年正式落地，于 2018
> - App Shell，集成了 vuetify 组件库
> - 主题切换
> - vue 的图标解决方案...
>
而现在 lavas 官网已经无法访问，这在很大程度上可以反应 PWA 在国内业务的一个现状。
#### Electron
![](https://cdn.xyxsw.site/wettrjryju.png)
Electron 是使用 JavaScript，HTML 和 CSS 构建跨平台的桌面应用程序的框架，可构建出兼容 Mac、Windows 和 Linux 三个平台的应用程序。
Electron 的跨端原理并不难理解：它通过集成浏览器内核，使用前端的技术来实现不同平台下的渲染，并结合了 Chromium 、Node.js 和用于调用系统本地功能的 API 三大板块。
Electron 的跨端原理并不难理解：它通过集成浏览器内核，使用前端的技术来实现不同平台下的渲染，并结合了 Chromium、Node.js 和用于调用系统本地功能的 API 三大板块。
- Chromium 为 Electron 提供强大的 UI 渲染能力，由于 Chromium 本身跨平台，因此无需考虑代码的兼容性。最重要的是，可以使用前端三板斧进行 Electron 开发。
- Chromium 并不具备原生 GUI 的操作能力，因此 Electron 内部集成 Node.js，编写 UI 的同时也能够调用操作系统的底层 API，例如 path、fs、crypto 等模块。
- Native API 为 Electron 提供原生系统的 GUI 支持，借此 Electron 可以调用原生应用程序接口。
### 原生渲染方案
使用JS开发，通过中间层桥接后使用原生组件来渲染UI界面。例如，在Android开发中是使用Kotin或Java来编写视图;在iOS开发中是使用Swift或Objective-C来编写视图。
使用 JS 开发，通过中间层桥接后使用原生组件来渲染 UI 界面。例如，在 Android 开发中是使用 Kotin 或 Java 来编写视图;在 iOS 开发中是使用 Swift 或 Objective-C 来编写视图。
#### React Native
React Native 是一个由 Facebook 于2015年9月发布的一款开源的 JavaScript 框架，它可以让开发者使用 JavaScript 和 React 来开发跨平台的移动应用。
React Native 是一个由 Facebook 于 2015 年 9 月发布的一款开源的 JavaScript 框架，它可以让开发者使用 JavaScript 和 React 来开发跨平台的移动应用。
![](https://cdn.xyxsw.site/eryyjyuj.png)
React Native 的思路是最大化地复用前端的生态和 Native 的生态，和 WebView 容器的最大区别在于 View 的渲染体系。React Native 抛弃了低效的浏览器内核渲染，转而**使用自己的 DSL 生成中间格式**，然后映射到对应的平台，**渲染成平台的组件**。相对 WebView 容器，体验会有一定的提升。不过，渲染时需要 JavaScript 和原生之间通信，在有些场景可能会导致卡顿。另外就是，渲染还是在Native层，要求开发人员对Native有一定的熟悉度。
React Native 的思路是最大化地复用前端的生态和 Native 的生态，和 WebView 容器的最大区别在于 View 的渲染体系。React Native 抛弃了低效的浏览器内核渲染，转而**使用自己的 DSL 生成中间格式**，然后映射到对应的平台，**渲染成平台的组件**。相对 WebView 容器，体验会有一定的提升。不过，渲染时需要 JavaScript 和原生之间通信，在有些场景可能会导致卡顿。另外就是，渲染还是在 Native 层，要求开发人员对 Native 有一定的熟悉度。
### 自渲染方案
简单来说，就是既不使用webview又不使用原生组件，而是使用自绘组件。
简单来说，就是既不使用 webview 又不使用原生组件，而是使用自绘组件。
#### Flutter
flutter 是近些年流行的跨端方案，跨的端包括安卓、ios、web 等。它最大的特点是渲染不是基于操作系统的组件，而是直接基于绘图库（skia）来绘制的，这样做到了渲染的跨端。
Flutter与上述Recat Native、WebView容器本质上都是不同的，它没有使用WebView、JavaScript解释器或者系统平台自带的原生控件，而是有一套自己专属的Widget，底层渲染使用自身的高性能C/C++ 引擎自绘。
Flutter 与上述 Recat Native、WebView 容器本质上都是不同的，它没有使用 WebView、JavaScript 解释器或者系统平台自带的原生控件，而是有一套自己专属的 Widget，底层渲染使用自身的高性能 C/C++ 引擎自绘。
### 小程序方案
使用小程序DSL + JS开发，通过中间层桥接后调用原生能力，使用webview来渲染UI界面。
从小程序的定位来讲，它就不可能用纯原生技术来进行开发，因为那样它的编译以及发版都得跟随微信，所以需要像Web技术那样，有一份随时可更新的资源包放在远程，通过下载到本地，动态执行后即可渲染出界面。
使用小程序 DSL + JS 开发，通过中间层桥接后调用原生能力，使用 webview 来渲染 UI 界面。
但如果用纯web技术来开发的话，会有一个很致命的缺点那就是在 Web 技术中，UI渲染跟 JavaScript 的脚本执行都在一个单线程中执行，这就容易导致一些逻辑任务抢占UI渲染的资源，这也就跟设计之初要求的快相违背了。
从小程序的定位来讲，它就不可能用纯原生技术来进行开发，因为那样它的编译以及发版都得跟随微信，所以需要像 Web 技术那样，有一份随时可更新的资源包放在远程，通过下载到本地，动态执行后即可渲染出界面。
因此微信小程序选择了Hybrid 技术，界面主要由成熟的 Web 技术渲染，辅之以大量的接口提供丰富的客户端原生能力。同时，每个小程序页面都是用不同的WebView去渲染，这样可以提供更好的交互体验，更贴近原生体验，也避免了单个WebView的任务过于繁重。
但如果用纯 web 技术来开发的话，会有一个很致命的缺点那就是在 Web 技术中，UI 渲染跟 JavaScript 的脚本执行都在一个单线程中执行，这就容易导致一些逻辑任务抢占 UI 渲染的资源，这也就跟设计之初要求的快相违背了。
微信小程序是以webview渲染为主，原生渲染为辅的混合渲染方式。
因此微信小程序选择了 Hybrid 技术，界面主要由成熟的 Web 技术渲染，辅之以大量的接口提供丰富的客户端原生能力。同时，每个小程序页面都是用不同的 WebView 去渲染，这样可以提供更好的交互体验，更贴近原生体验，也避免了单个 WebView 的任务过于繁重。
小程序的架构模型有别与传统web单线程架构，小程序为双线程架构。
微信小程序是以 webview 渲染为主，原生渲染为辅的混合渲染方式。
微信小程序的渲染层与逻辑层分别由两个线程管理，渲染层的界面使用 webview 进行渲染；逻辑层采用 JSCore运行JavaScript代码。
小程序的架构模型有别与传统 web 单线程架构，小程序为双线程架构。
微信小程序的渲染层与逻辑层分别由两个线程管理，渲染层的界面使用 webview 进行渲染；逻辑层采用 JSCore 运行 JavaScript 代码。
![](https://cdn.xyxsw.site/rtjyujyu.png)
## 类前端开发：拿过来吧你
现代的客户端开发平台继承和发扬了Web的HTML语言的方式来构建表现层开发平台，其中有代表性的是XAML，Flex，JavaFX，Android几个平台。他们都使用基于XML的描述性语言作为开发语言，并且提供可视化的开发环境，使用一种强类型的程序设计语言作为背后支撑。完成表现层开发工作的前端开发人员只需要熟练掌握表现层开发语言极其机制，熟练使用表现层开发工具，少量掌握背后的程序设计语言就可以很好地完成表现层开发工作。主要原因是基于XMl的方式设计UI，可以使得视图层和逻辑层进行一个分离，更清晰、更灵活。XML可以进行一个可视化开发，门槛低，易上手。
现代的客户端开发平台继承和发扬了 Web 的 HTML 语言的方式来构建表现层开发平台，其中有代表性的是 XAML，Flex，JavaFX，Android 几个平台。他们都使用基于 XML 的描述性语言作为开发语言，并且提供可视化的开发环境，使用一种强类型的程序设计语言作为背后支撑。完成表现层开发工作的前端开发人员只需要熟练掌握表现层开发语言极其机制，熟练使用表现层开发工具，少量掌握背后的程序设计语言就可以很好地完成表现层开发工作。主要原因是基于 XMl 的方式设计 UI，可以使得视图层和逻辑层进行一个分离，更清晰、更灵活。XML 可以进行一个可视化开发，门槛低，易上手。
因此，有许多语言都采用类前端的方式进行视图层的开发，然后其他语言进行逻辑层的开发。
## .NET
微软的.NET 就是基于XAML开发视图层，支持可视化开发（低代码）。
## 鸿蒙ArkTs
基于JS扩展的类Web开发范式的方舟开发框架包括应用层（Application）、前端框架层（Framework）、引擎层（Engine）、平台适配层（Porting Layer）
微软的.NET 就是基于 XAML 开发视图层，支持可视化开发（低代码）。
JS UI框架采用类HTML和CSS Web编程语言作为页面布局和页面样式的开发语言，页面业务逻辑则支持ECMAScript规范的JavaScript语言。JS UI框架提供的类Web编程范式，可以让开发者避免编写UI状态切换的代码，视图配置信息更加直观。
## 鸿蒙 ArkTs
基于 JS 扩展的类 Web 开发范式的方舟开发框架包括应用层（Application）、前端框架层（Framework）、引擎层（Engine）、平台适配层（Porting Layer）
JS UI 框架采用类 HTML 和 CSS Web 编程语言作为页面布局和页面样式的开发语言，页面业务逻辑则支持 ECMAScript 规范的 JavaScript 语言。JS UI 框架提供的类 Web 编程范式，可以让开发者避免编写 UI 状态切换的代码，视图配置信息更加直观。
![](https://cdn.xyxsw.site/3465ytyjyjy.png)
## 跨端不只是跨端：爱你的全世界
## 什么样的场景可以跨端？
跨端应用能够真正推进下去，除了有技术保障外，还需要合适的需求场景，使用PC端的功能型产品主要是需要大屏带来的“效率”（办公、个人管理、教育）与“沉浸”（数据、金融、游戏、影视）体验。
跨端应用能够真正推进下去，除了有技术保障外，还需要合适的需求场景，使用 PC 端的功能型产品主要是需要大屏带来的“效率”（办公、个人管理、教育）与“沉浸”（数据、金融、游戏、影视）体验。
![](https://cdn.xyxsw.site/ertehry.png)
![](https://cdn.xyxsw.site/ertjyunyunm.png)
依赖PC、移动双端进行经营管理的电商场景，也有很多内容适合跨端。
依赖 PC、移动双端进行经营管理的电商场景，也有很多内容适合跨端。
## 跨端UI如何设计
跨端的UI设计不仅仅是响应式，布局没问题就行，而是从PC端“网页”到移动端“App”的体验映射。
## 跨端 UI 如何设计
1. 双端基础组件设计规则对齐（对前端来说是同类组件API、属性对齐以及组件功能形态映射）
跨端的 UI 设计不仅仅是响应式，布局没问题就行，而是从 PC 端“网页”到移动端“App”的体验映射。
1. 双端基础组件设计规则对齐（对前端来说是同类组件 API、属性对齐以及组件功能形态映射）
![](https://cdn.xyxsw.site/ewttrhjy.png)
Select对应Picker
Select 对应 Picker
1. 布局响应规则（行列变化，聚合变化等）；
@@ -201,21 +216,23 @@ Select对应Picker
表单型弹窗对应新页面
1. 不同场景的跨端策略，例如Dashboard页面的跨端应保证用户在首屏快速获取关键信息，下图的Bootstrap模板是一个错误示例，移动端的布局方式浪费首屏空间，降低用户获取关键信息的效率。
1. 不同场景的跨端策略，例如 Dashboard 页面的跨端应保证用户在首屏快速获取关键信息，下图的 Bootstrap 模板是一个错误示例，移动端的布局方式浪费首屏空间，降低用户获取关键信息的效率。
![](https://cdn.xyxsw.site/20191118BrYZzg.jpg)
Mobile first 不是唯一准则。进行具体场景的跨端设计时，我们会从两端场景出发重新对比分析用户的需求差异，明确体验的增强点与折损点。特别是电商中后台场景中：有些业务中用户的主阵地并不是在移动端，而是PC端，比如用户运营策略的设置；有些是两端分别承载不同的场景需求，比如任务的处理。
Mobile first 不是唯一准则。进行具体场景的跨端设计时，我们会从两端场景出发重新对比分析用户的需求差异，明确体验的增强点与折损点。特别是电商中后台场景中：有些业务中用户的主阵地并不是在移动端，而是 PC 端，比如用户运营策略的设置；有些是两端分别承载不同的场景需求，比如任务的处理。
## 高效开发++：人的生命是有限的
## 前后端不分离
当我们开始进行跨端开发的时候，我们会遇到一个很尴尬的问题。比如，我们要开发一个客户端或者说APP，利用前端跨端技术开发。此时，我们不得不既要开发前端，又要涉及后端的部分内容。例如，获取相关数据之类的。此时，我们使用前后端分离的方式，在某些情境下就有可能不妥。尤其是仅个人开发，已经有代码洁癖，又要前后端分离，那显然是一种不明智的开发方式。所以，很多情况下，进行一个前后端不分离的方式开发前后端，或许是一个好的方法。
当我们开始进行跨端开发的时候，我们会遇到一个很尴尬的问题。比如，我们要开发一个客户端或者说 APP，利用前端跨端技术开发。此时，我们不得不既要开发前端，又要涉及后端的部分内容。例如，获取相关数据之类的。此时，我们使用前后端分离的方式，在某些情境下就有可能不妥。尤其是仅个人开发，已经有代码洁癖，又要前后端分离，那显然是一种不明智的开发方式。所以，很多情况下，进行一个前后端不分离的方式开发前后端，或许是一个好的方法。
## Serveless
简而言之，就是**云函数（分布式）+云数据库（分布式）**。
Serverless字面意思是无服务，但并不代表再也不需要服务器了，而是指开发者不需要过多的考虑服务器的问题，计算资源作为服务出现而不是服务器的概念出现。 那么Serverlss，是对全部底层资源和操作的封装，让开发者专注于业务逻辑。
简而言之，就是**云函数（分布式）+ 云数据库（分布式）**。
Serverless 字面意思是无服务，但并不代表再也不需要服务器了，而是指开发者不需要过多的考虑服务器的问题，计算资源作为服务出现而不是服务器的概念出现。那么 Serverlss，是对全部底层资源和操作的封装，让开发者专注于业务逻辑。
![](https://cdn.xyxsw.site/gfhuewgfuiwe.png)
@@ -226,19 +243,20 @@ FaaS（Function-as-a-Service）是服务商提供一个平台、提供给用户
BaaS（Backend-as-a-Service）后端即服务，包含了后端服务组件，它是基于 API 的第三方服务，用于实现应用程序中的核心功能，包含常用的数据库、对象存储、消息队列、日志服务等等。
### 适用场景
Serverless 带来的其实是前端研发模式上的颠覆。相对以往纯前端研发的方式，Serverless 屏蔽底层基础设施的复杂度，后台能力通过FaaS平台化，我们不再需要关注运维、部署的细节，开发难度得到了简化，前端开发群体的边界就得以拓宽，能够参与到业务逻辑的开发当中，更加贴近和理解业务，做更有价值的输出。
- 场景1: 负载有波峰波谷
Serverless 带来的其实是前端研发模式上的颠覆。相对以往纯前端研发的方式，Serverless 屏蔽底层基础设施的复杂度，后台能力通过 FaaS 平台化，我们不再需要关注运维、部署的细节，开发难度得到了简化，前端开发群体的边界就得以拓宽，能够参与到业务逻辑的开发当中，更加贴近和理解业务，做更有价值的输出。
波峰波谷时，机器资源要按照峰值需求预，比如医院挂号这需求，假设在每天10点放号预约，那10点就会有峰值的出现，为了这个峰值并发的考虑，准备了相对应性能（固定）的服务器，然而在波谷时机器利用率又明显下降，不能进行资源复用导致浪费，而serverless不用为了波峰去做准备，不用留住水位，支持弹性缩扩容，在你高峰时再在进行动态扩容
- 场景 1: 负载有波峰波谷
- 场景2: 定时任务（报表统计等）
波峰波谷时，机器资源要按照峰值需求预，比如医院挂号这需求，假设在每天 10 点放号预约，那 10 点就会有峰值的出现，为了这个峰值并发的考虑，准备了相对应性能（固定）的服务器，然而在波谷时机器利用率又明显下降，不能进行资源复用导致浪费，而 serverless 不用为了波峰去做准备，不用留住水位，支持弹性缩扩容，在你高峰时再在进行动态扩容
服务空闲时间来处理批量数据，来生成数据报表，通过Serverless方式，不用额外购买利用率并不高的处理资源，比如每日的凌晨，分析前一天收集的数据并生成报告
- 场景 2: 定时任务（报表统计等）
- 场景3: 小程序开发（云开发）
服务空闲时间来处理批量数据，来生成数据报表，通过 Serverless 方式，不用额外购买利用率并不高的处理资源，比如每日的凌晨，分析前一天收集的数据并生成报告
比如微信小程序开发m在实际开发中，如果我们不用云开发的openid获取流程，而用传统的方式，你就知道openid的获取是非常繁琐的一个过程，前端需要通过wx.login获取一个code值（具有时效性）再通过code值去后台用appsecret去调取openid。
- 场景 3: 小程序开发（云开发）
比如微信小程序开发 m 在实际开发中，如果我们不用云开发的 openid 获取流程，而用传统的方式，你就知道 openid 的获取是非常繁琐的一个过程，前端需要通过 wx.login 获取一个 code 值（具有时效性）再通过 code 值去后台用 appsecret 去调取 openid。
### 特点
@@ -270,16 +288,17 @@ Serverless 带来的其实是前端研发模式上的颠覆。相对以往纯前
## 理论结束 现在进入实践教学
## uniapp实战
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。
## uniapp 实战
开发者按uni-app规范编写代码，由编译器将开发者的代码编译生成每个平台支持的特有代码：
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到 iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。
- 在web平台，将.vue文件编译为js代码。与普通的vue cli项目类似
- 在微信小程序平台，编译器将.vue文件拆分生成wxml、wxss、js等代码
- 在app平台，将.vue文件编译为js代码。进一步，如果涉及uts代码：
- 在Android平台，将.uts文件编译为kotlin代码
- 在iOS平台，将.uts文件编译为swift代码
开发者按 uni-app 规范编写代码，由编译器将开发者的代码编译生成每个平台支持的特有代码：
- 在 web 平台，将.vue 文件编译为 js 代码。与普通的 vue cli 项目类似
- 在微信小程序平台，编译器将.vue 文件拆分生成 wxml、wxss、js 等代码
- 在 app 平台，将.vue 文件编译为 js 代码。进一步，如果涉及 uts 代码：
- 在 Android 平台，将.uts 文件编译为 kotlin 代码
- 在 iOS 平台，将.uts 文件编译为 swift 代码
![](https://cdn.xyxsw.site/uni-function-diagram.png)
@@ -287,23 +306,22 @@ uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编
2. 云函数、云数据库
3. 设计稿转代码（[https://ide.code.fun/projects/619b7f3804575d001169ac66/pages/6442c187b98f5d001164a6a4](https://ide.code.fun/projects/619b7f3804575d001169ac66/pages/6442c187b98f5d001164a6a4)）
## vitesse-lite-py实战
## vitesse-lite-py 实战
[https://github.com/MarleneJiang/vitesse-lite-py](https://github.com/MarleneJiang/vitesse-lite-py)
1. 域间通信
2. laf云函数
2. laf 云函数
3. 设计稿转代码（[https://ide.code.fun/projects/619b7f3804575d001169ac66/pages/6442c187b98f5d001164a6a4](https://ide.code.fun/projects/619b7f3804575d001169ac66/pages/6442c187b98f5d001164a6a4)）
## Electron实战
## Electron 实战
1. Frameless：桌面端不仅仅只有方框矩形，而是想你所想。
![](https://cdn.xyxsw.site/df77f01037fc4ceb8d4aa8f06168fc95~tplv-k3u1fbpfcp-zoom-in-crop-mark_4536_0_0_0.gif)
## 参考作业
尝试使用某种跨端框架和云函数，实现一个查看课表应用，形式不限。推荐使用hdu-lis包拿到数据。
尝试使用某种跨端框架和云函数，实现一个查看课表应用，形式不限。推荐使用 hdu-lis 包拿到数据。
![](https://cdn.xyxsw.site/Snipaste_2023-04-22_18-57-44.png)

86
7.网络应用开发/7.1.2.1基础部分.md
View File

@@ -7,39 +7,39 @@ Hello~这里是杭电助手技术部后端，无论基础如何，您都可以
:::
本任务将涉及以下知识：
- Go 语言（又称 Golang） 开发环境搭建、基础语法知识、Gin 框架的使用
- Go 语言（又称 Golang）开发环境搭建、基础语法知识、Gin 框架的使用
- HTTP 基础知识
- 登录系统的接口设计
- 一点点的工程基础
不需要担心，后续我们将给出充足的资料和路线，相信这些对你一定不是难题~
> 在学习初期，视频可以帮助你快速理解并踏入大门，但在学习的后期，文档&博客才拥有第一手资料和最新动态(视频就像你的教科书，更新的脚步永远跟不上技术)。<br/>在任务初期我们将给出对应的视频资料，在后期我们只给出图文资料。<br/>👏 当然，这不是强制要求：学的舒服是原则
> 在学习初期，视频可以帮助你快速理解并踏入大门，但在学习的后期，文档&博客才拥有第一手资料和最新动态 (视频就像你的教科书，更新的脚步永远跟不上技术)。<br/>在任务初期我们将给出对应的视频资料，在后期我们只给出图文资料。<br/>👏 当然，这不是强制要求：学的舒服是原则
# 👋 初识 Go 语言 (Day 1)
## 👋 初识 Go 语言 (Day 1)
> Go（又称 Golang）是 Google 开发的一种静态，强类型、编译型、并发型的编程语言。其于 2009 年 11 月正式发布，成为开源代码项目。Go 的语法接近 C 语言，但其支持垃圾回收功能，开发效率远高于 C 语言。而其对海量并发的支持，以及在运行效率，低内存消耗方面的优异表现，也有人称其为互联网时代的 C 语言。
<del>↑ 太官方了，我的评价是不如看资料(</del>
<del>↑ 太官方了，我的评价是不如看资料 (</del>
官网虽然是英文，但是非常非常的友好，近年还刚翻新过一次好看了许多，还有各种可爱的吉祥物插图。
这只吉祥物囊袋鼠的英文学名为 **Gopher**，每位热爱 Golang 的开发者都会自称 **Gopher** (就像 jvaver 一样(x)，而它的造型出于创始人之一 Rob Pike 的妻子之手。
这只吉祥物囊袋鼠的英文学名为 **Gopher**，每位热爱 Golang 的开发者都会自称 **Gopher** (就像 jvaver 一样 (x)，而它的造型出于创始人之一 Rob Pike 的妻子之手。
#### 视频资料(**P2-P3**)：
### 视频资料 (**P2-P3**)：
<Bilibili bvid='BV1zR4y1t7Wj'/>
#### 文字资料：
### 文字资料：
- Golang 官网(非常好记: go.dev(eloper))
- Golang 官网 (非常好记：go.dev(eloper))
https://go.dev/
<https://go.dev/>
- 一些第三方的前景概览
https://www.topgoer.com/
<https://www.topgoer.com/>
#### 补充资料：
### 补充资料：
- [我使用 Golang 两年后的总结：优点和令人讨厌的怪癖](https://www.infoq.cn/article/ydmrvvr1ijaaih3eh5fw) - 比较客观的开发体验
- [许式伟：我与 Go 语言的这十年](https://cloud.tencent.com/developer/article/1043859) - 七牛云 CEO、前 WPS 首席架构师、Go 语言布道师
@@ -48,9 +48,9 @@ Hello~这里是杭电助手技术部后端，无论基础如何，您都可以
对比两篇博客，可以清晰地感受到 Golang 的发展之快：曾经还在娘胎里的 Golang，现在已经在云原生、微服务、CLI 程序、DevOps、区块链等领域大杀四方。
# 😥 Golang 环境搭建 (Day1 - 2)
## 😥 Golang 环境搭建 (Day1 - 2)
Golang 是一门年轻的语言(相比 Java & JavaScript)，它没有那么多的历史包袱，所以环境搭建在一众语言中可以算得上十分容易。同时 Golang 自带了丰富的工具链，许多 Gopher 的整个职业生涯中可能都不需要用到官方工具链以外的相关工具。
Golang 是一门年轻的语言 (相比 Java & JavaScript)，它没有那么多的历史包袱，所以环境搭建在一众语言中可以算得上十分容易。同时 Golang 自带了丰富的工具链，许多 Gopher 的整个职业生涯中可能都不需要用到官方工具链以外的相关工具。
::: tip 📌
本小节还请同学们各显神通，由于不同计算机不同环境不同平台的区别，Golang 环境搭建各有区别。资料中将尽可能给出一些教程，但具体需同学们使用搜索引擎寻找最佳实践。出现问题在群内积极提问~
@@ -62,11 +62,11 @@ Golang 是一门年轻的语言(相比 Java & JavaScript)，它没有那么多
首先是万能的 VSCode
https://code.visualstudio.com/
<https://code.visualstudio.com/>
还有智能的 GoLand
https://www.jetbrains.com/go/
<https://www.jetbrains.com/go/>
喜欢折腾的同学可以选择 VSCode 作为自己的开发工具，如果想能够马上上手学习的同学，可以使用 GoLand 作为自己的开发工具
@@ -74,77 +74,75 @@ https://www.jetbrains.com/go/
GoLand 可以使用教育邮箱学生认证白嫖噢~👀
:::
#### 视频资料(**P4-P6**)：
### 视频资料 (**P4-P6**)：
<Bilibili bvid='BV1zR4y1t7Wj'/>
#### 文字资料：
### 文字资料：
- VSCode 的爹亲自教你装 Golang 环境
https://learn.microsoft.com/zh-cn/azure/developer/go/configure-visual-studio-code
<https://learn.microsoft.com/zh-cn/azure/developer/go/configure-visual-studio-code>
- 使用 GoLand 搭建
https://polarisxu.studygolang.com/posts/go/2022-dev-env/
<https://polarisxu.studygolang.com/posts/go/2022-dev-env/>
#### 补充资料
### 补充资料
> 这些文章只是帮助你理解的更透彻，看不懂完全没关系。甚至你完全可以跳过他们，在任务结束后再来看看，或许你会有更多收获。
- Golang 依赖管理的前世今生：[ 一文搞懂 Go Modules 前世今生及入门使用 - 掘金](https://juejin.cn/post/6844904166310019086)
- IDEA 系列学生认证教程(用 GoLand 必看)：[学生邮箱白嫖 JetBrains 全家桶——保姆级教程](https://zhuanlan.zhihu.com/p/136497468)
- Golang 依赖管理的前世今生：[一文搞懂 Go Modules 前世今生及入门使用 - 掘金](https://juejin.cn/post/6844904166310019086)
- IDEA 系列学生认证教程 (用 GoLand 必看)：[学生邮箱白嫖 JetBrains 全家桶——保姆级教程](https://zhuanlan.zhihu.com/p/136497468)
# 😕 Golang 基础语法的学习 (Day 1-8)
## 😕 Golang 基础语法的学习 (Day 1-8)
Golang 的语法是 C/C++ 系的，在许多地方你都可以看到他们的影子，这对未来 C 的学习更有自顶向下的帮助。当然，如果你曾经用过 Java、Python，Golang 的语法你可能会不太习惯，这不会是问题~在熟悉语法后，你会发现 “Golang 一把梭” 是真实存在的 🤓。
Golang 的语法是 C/C++ 系的，在许多地方你都可以看到他们的影子，这对未来 C 的学习更有自顶向下的帮助。当然，如果你曾经用过 Java、Python，Golang 的语法你可能会不太习惯，这不会是问题~在熟悉语法后，你会发现“Golang 一把梭”是真实存在的 🤓。
**对于基础语法的学习，无需一时学习过深，也不必花费过多时间在此**。**即使半懵半懂，在多次实践后也会渐渐领悟**
本次任务并不需要用到反射、并发等高级特性(学到时可选择性暂时避开)，最深只需要用到结构体与方法的相关知识。
本次任务并不需要用到反射、并发等高级特性 (学到时可选择性暂时避开)，最深只需要用到结构体与方法的相关知识。
#### 视频资料(P9-P56 每集视频并不长，不要被吓到了喔)：
### 视频资料 (P9-P56 每集视频并不长，不要被吓到了喔)：
<Bilibili bvid='BV1zR4y1t7Wj'/>
### 文字资料：
#### 文字资料：
- 非常推荐的 Go Tour 中文版。Go Tour 是 **Go 官方为初学者打造的渐进式教程**，你可以跟随着它的步伐一点点探索 Go 语言。Go Tour 的代码都充满着它的**设计哲学与最佳实践**，是每位 Gopher 的必经之路。同时它也是**交互式的**，左侧是教程，右侧能直接敲代码，在网页上运行。
- 非常推荐的 Go Tour 中文版。Go Tour 是 **Go 官方为初学者打造的渐进式教程**，你可以跟随着它的步伐一点点探索 Go 语言 。Go Tour 的代码都充满着它的**设计哲学与最佳实践**，是每位 Gopher 的必经之路。同时它也是**交互式的**，左侧是教程，右侧能直接敲代码，在网页上运行。
https://tour.go-zh.org/welcome/1
<https://tour.go-zh.org/welcome/1>
- 短小精湛的 Golang 入门教程，是 The Little Go Book 的中文翻译
https://learnku.com/docs/the-little-go-book
<https://learnku.com/docs/the-little-go-book>
#### 补充资料：
### 补充资料：
- [Go by Example 中文版](https://gobyexample-cn.github.io/) - Go by Example 是对 Go 基于实践的介绍，包含一系列带有注释说明的示例程序。
- [《Go 入门指南》](https://learnku.com/docs/the-way-to-go) - 《Go 入门指南》是 《The Way to Go》的中文译本，本书专为 Golang 初学者量身定制。教程较老，小部分内容有点过时，但质量很高。
- [《Go 入门指南》](https://learnku.com/docs/the-way-to-go) - 《Go 入门指南》是《The Way to Go》的中文译本，本书专为 Golang 初学者量身定制。教程较老，小部分内容有点过时，但质量很高。
- [《Go 语言 101》](https://gfw.go101.org/) - 《Go 101》详细描述了 Golang 部分底层原理、最佳实践、代码风格、常见错误，适合进一步深入阅读。
- [《Go 语言圣经》](https://books.studygolang.com/gopl-zh/) - 《The Go Programming》的中文版，是官方书籍。内容相当老，但包含着 Golang 的设计哲学与建设初期的思考和路线。
# 🎯 HTTP 协议学习 (Day 9-10)
## 🎯 HTTP 协议学习 (Day 9-10)
如果你从未接触过协议二字，那 HTTP 协议将是你大学生涯最重要的协议之一，也是 Web 的基础。与其说是小任务的基础，我更想说这是对人类互联的探索。
HTTP 协议起草与演进之路十分坎坷，但每一步都举足轻重，在人类历史上画下了浓墨重彩的一笔。
#### 文字资料：
### 文字资料：
- 非常著名的阮一峰博客 **(他的博客可以从最早开始都过一遍，很多计算机科普可以说永不过时)**
https://www.ruanyifeng.com/blog/2016/08/http.html
<https://www.ruanyifeng.com/blog/2016/08/http.html>
- 图解系列非常有意思，最重要的是不止于介绍协议，更为你道来其历史设计的进程。本书不必在任务期间内看完，但我相信你会爱上它的。
https://book.douban.com/subject/25863515/
<https://book.douban.com/subject/25863515/>
- 经典菜鸟教程，不过有点枯燥乏味。可以用于回顾和工具书查阅。
https://www.runoob.com/http/http-intro.html
<https://www.runoob.com/http/http-intro.html>
#### 补充资料：
@@ -158,9 +156,9 @@ https://www.runoob.com/http/http-intro.html
> MDN 是一个不断发展的学习网络技术和网络软件的平台。MDN 的使命简单明了：提供一个更好的网络蓝图并赋能新一代开发者和内容创意者在此之上构建网络。
# 🎉 回到正题：小任务
## 🎉 回到正题：小任务
> 一些题外话：是的，任务期已经过去了约十天(当然优秀的你可能更快~)，但在我看来，小任务其实已经不再那么重要了。如果在以上小节中你曾感到兴奋、热情、探索的欲望，我诚挚地相信，你能在技术的道路上走的很远很远~
> 一些题外话：是的，任务期已经过去了约十天 (当然优秀的你可能更快~)，但在我看来，小任务其实已经不再那么重要了。如果在以上小节中你曾感到兴奋、热情、探索的欲望，我诚挚地相信，你能在技术的道路上走的很远很远~
用了这么长的时间铺垫了以上的基础知识，脑子肯定胀满了各种各样的东西：if for range slice interface http …… 是时候释放他们了！
@@ -168,7 +166,7 @@ https://www.runoob.com/http/http-intro.html
<del>经过了上文详细的“喂饭”小节，下面轮到同学们自己吃饭了~</del>
#### 系统概述
### 系统概述
- 使用 Gin 框架设计登录系统的接口与整体结构。
- 至少设计 `Login` `GetUser` `Logout` 三个接口，对 `GetUser` 接口鉴权。
@@ -179,7 +177,7 @@ https://www.runoob.com/http/http-intro.html
#### Gin
在 HTTP 小节中，“路由 “接口” “鉴权” “请求” “响应” 你一定或多或少地接触过， Gin 就是一群 Gopher 大神帮你解决了这些问题，它十分轻量但五脏俱全，你只需要调用几个函数就将 cover 那些复杂的问题。
在 HTTP 小节中，“路由“接口” “鉴权” “请求” “响应”你一定或多或少地接触过，Gin 就是一群 Gopher 大神帮你解决了这些问题，它十分轻量但五脏俱全，你只需要调用几个函数就将 cover 那些复杂的问题。
请运用你在第三小节中学习的 `Golang 包(依赖)管理` 正确地安装 Gin 并学习使用它。
@@ -203,7 +201,7 @@ https://www.runoob.com/http/http-intro.html
:::
- 如果你的所有代码都在一个文件里，请尝试让他变得有模块感~
- 如果你的账号密码写死(硬编码)在程序中，请尝试让它能动态变化~
- 如果你的账号密码写死 (硬编码) 在程序中，请尝试让它能动态变化~
- 发现更多有趣的 Golang 第三方库，尝试将它加入你的程序~
- 如果你能想到任何方式丰富项目功能、优化代码结构，以及想加的内容，请尽情发挥~
- ……

6
7.网络应用开发/7.1.2.2进阶部分.md
View File

@@ -14,9 +14,9 @@
- 第三方库集合 (你可以在其中尝试找到你需要的东西)
https://github.com/avelino/awesome-go
<https://github.com/avelino/awesome-go>
https://github.com/jobbole/awesome-go-cn
<https://github.com/jobbole/awesome-go-cn>
## 扩展接口
@@ -28,7 +28,7 @@ https://github.com/jobbole/awesome-go-cn
## 优化存储
如果将信息全部放在结构体(内存)中，程序关闭后就将丢失已经登录的所有信息，请尝试使用“数据库”为你的服务添加永久存储的能力。
如果将信息全部放在结构体 (内存) 中，程序关闭后就将丢失已经登录的所有信息，请尝试使用“数据库”为你的服务添加永久存储的能力。
## 日志

2
7.网络应用开发/7.1WEB开发入门.md
View File

@@ -1,7 +1,7 @@
# 7.网络应用开发入门
> 作者：aFlyBird0
>
> 我本来写了一大堆客套话，诸如各位“恭喜各位看到这里”、“本章节多么多么有趣、干货、面向就业”。然后全部删掉，决定采用结构化的写作方式来写。
## 章节题目解释

2
7.网络应用开发/7.网络应用开发入门.md
View File

@@ -1,3 +1,3 @@
# 7.网络应用开发入门
本章节原本的名字是「WEB开发入门」，后来发现这个标题涵盖的范围还是小了点。因为网络应用开发不仅仅涉及到前端的网页设计和开发、后端数据库操作等方面，还包括云原生的应用部署和管理等等一系列相关知识。因此，我们拓展了这一章节的内容，以便读者可以全面了解网络应用开发的各个方面。
本章节原本的名字是「WEB 开发入门」，后来发现这个标题涵盖的范围还是小了点。因为网络应用开发不仅仅涉及到前端的网页设计和开发、后端数据库操作等方面，还包括云原生的应用部署和管理等等一系列相关知识。因此，我们拓展了这一章节的内容，以便读者可以全面了解网络应用开发的各个方面。

37
8.基础学科/8.1经济学科普Part1.md
View File

@@ -1,6 +1,6 @@
# 经济学科普Part1
# 经济学科普 Part1
> Author：Yuelun Yu
> Author: Yuelun Yu
## 前言
@@ -14,7 +14,7 @@
这篇文档只会介绍简单的经济学概念和模型，希望能够引起一些思考。更深入的内容，如结合实际、结合金融工程的内容，会在之后另有讨论。
## 最简单生产-消费模型
## 最简单生产 - 消费模型
### 以物换物和它的缺陷
@@ -57,13 +57,13 @@
| 行为 | 做面粉的 | 做面包的 |
| -------- | --------------------------- | --------------------------- |
| 开始 | 初始信用 0 | 初始信用 1 |
| 交易面粉 | 信用 +1（1） | 信用-1（0），获得 50 斤面粉 |
| 交易面包 | 信用-1（0），获得 25 个面包 | 信用 +1（1） |
| 交易面粉 | 信用 +1（1） | 信用 -1（0），获得 50 斤面粉 |
| 交易面包 | 信用 -1（0），获得 25 个面包 | 信用 +1（1） |
| 期末信用 | 0 | 1 |
稍微看一下就会发现，这个所谓的信用，和现在的**货币**没有任何区别，如果用现在的话说，一个信用就相当于 25 个面包
因此，可以得到一个结论，**货币就是信用**， 只是现在我们在使用货币时，信任的不是对面的人，而是国家，**货币事实上就是国家信用**。
因此，可以得到一个结论，**货币就是信用**，只是现在我们在使用货币时，信任的不是对面的人，而是国家，**货币事实上就是国家信用**。
> 这个加入第三方解决问题的思想在计算机科学里也非常常见（没有什么问题是加一个中间层不能解决的），在经济学里亦是如此。但额外补充，引入第三方信用的方案看似是分散了风险，但当考虑金融资产之间的关联性时，可能已经分散的风险又会集中，这是系统性风险的最大来源。（比如，国家如果破产了怎么办？）对应到对第三方的信用丧失，最常见的应对策略是买入避险资产，目前唯一的公认避险资产是黄金。（黄金从性质上来说具有天然的信用（不可人工制造，也就是不会突然增加减少，自然保有量即是信用），而且没有货币作用之外的属性（不能吃，不能穿，没有用，不是工业原料），是天然的货币）
@@ -81,7 +81,7 @@
| -------- | ------------------------------ | ---------------- |
| 开始 | 初始货币 100 | 初始货币 100 |
| 交易面粉 | 货币 +50（150） | 获得 50 斤面粉 |
| 交易面包 | 货币-100（50），获得 25 个面包 | 货币 +100（150） |
| 交易面包 | 货币 -100（50），获得 25 个面包 | 货币 +100（150） |
| 期末 | 50（25 个面包） | 150（25 个面包） |
可以看到，由于价格比例的变动，为了维持原先的消费状况，面粉厂不得不增加相应的开支，再 1 轮交易之后，面粉厂就会因为没有货币而无法参与交易。
@@ -116,7 +116,7 @@
| -------- | ------------------------------ | ---------------- |
| 开始 | 初始货币 100 | 初始货币 100 |
| 交易面粉 | 货币 +50（150） | 获得 50 斤面粉 |
| 交易面包 | 货币-50（100），获得 25 个面包 | 货币 +50（100） |
| 交易面包 | 货币 -50（100），获得 25 个面包 | 货币 +50（100） |
| 挖矿 | 货币 +20 | 货币 +20 |
| 期末 | 120（25 个面包） | 120（25 个面包） |
@@ -145,7 +145,7 @@
| 开始 | 初始货币 100 | 初始货币 100 | 0 |
| 铸币 | | | 铸币 4 |
| 交易面粉 | 货币 +50（150） | 获得 50 斤面粉 | |
| 交易面包 | 货币-48（102），获得 24 个面包 | 货币 +52（102） | 购买 2 个面包（-4） |
| 交易面包 | 货币 -48（102），获得 24 个面包 | 货币 +52（102） | 购买 2 个面包（-4） |
| 期末 | 102（24 个面包） | 102（24 个面包） | 0（2 个面包） |
上述现象的神奇之处在于，**铸币部门不做任何工作就获得了面包分配，而面粉厂与面包厂在不了解经济运行全貌的情况下，总是认为自己是由于节俭而增加了储蓄**。
@@ -167,7 +167,7 @@
| 开始 | 初始货币 100 | 初始货币 100 | 初始货币 20 |
| 内部生产与消费 | 结余面包 10 | 结余衣物 10 | |
| 商人倒卖面包 | 面包厂 +20 | -40（+10 面包） | +20（-20、+40） |
| 商人倒卖衣物 | 面包厂-40 | +20 | +20（-20、+40） |
| 商人倒卖衣物 | 面包厂 -40 | +20 | +20（-20、+40） |
| 期末 | 80（内部消费 40 个面包，售出 10 个，消费 10 件衣物） | 80（内部消费 40 件衣物，售出 10 件，消费 10 个面包） | 40（假设商人不消费） |
这里其实有很多问题可以讨论：
@@ -223,7 +223,7 @@
### 小结
本节中简单讨论了最简单的生产-消费模型，引入了货币的概念，并引入了铸币税、贸易等基本的经济学概念。
本节中简单讨论了最简单的生产 - 消费模型，引入了货币的概念，并引入了铸币税、贸易等基本的经济学概念。
本节最后，讨论了债务和货币沉积。在接下来的讨论中，会引入“银行”等新的经济实体，这会从根本上改变经济系统的运作方式。在此上下文下，货币沉积甚至是保证银行正常运行的基础、债务会带来经济繁荣。可以留意后文的讨论再来做对比。
@@ -231,10 +231,9 @@
1. 当前，中国的农村老人养老金很少遭到诟病，能否通过提升他们的养老金来提高他们的生活质量呢？养老金，或者说货币流通、再分配的本质是什么？
## 虚假的繁荣经济
# 虚假的繁荣经济
## 生产余力与经济繁荣
### 生产余力与经济繁荣
假设甲村的人非常聪明，他们发明了一种能够全自动播种、收割小麦的机器，使得面粉的产量增加了 10%。现在甲村就有 3 个经济部门了。分别是：面粉厂、面包厂和农机厂。
@@ -251,7 +250,7 @@
| 开始 | 初始货币 50 | 初始货币 50 | 0 |
| 铸币 | | | 铸币 10 |
| 交易面粉 | 货币 +50（100） | 获得 50 斤面粉 | |
| 交易面包 | 货币-50（50），获得 50 个面包 | 货币 +50（50） | |
| 交易面包 | 货币 -50（50），获得 50 个面包 | 货币 +50（50） | |
| 政府刺激消费 | 货币 +5，生产 5 斤面粉 | 货币 +5，售出 5 个面包 | -10(消费面包) |
| 期末 | 55 | 55 | 0 |
@@ -261,7 +260,7 @@
**可惜的是，要增加多少储蓄才能让人们有足够多的消费意愿这一问题根本无法准确回答，政府部门在这一过程中总是倾向于多发行货币，因此，这种情况下通常也会带来商品价格的上涨。**
## 产出结构、资源分配
### 产出结构、资源分配
在上文提到，甲村现在有了个新的经济部门，农机制造部门。
@@ -279,7 +278,7 @@
**这一事实说明经济系统的运行规则存在其固有缺陷，并不一定可以把资源倾斜给实际提供产出的部门，相反，随着面包产量增加、政府增发货币，农机厂可能是收入提升最少的，意味着农机厂获得的资源分配会越来越少。**
## 不可能的指数增长
### 不可能的指数增长
我们总是用指数化的方式来描述经济的增长，总说这一期的产量较上一年增长了多少百分比。但若仔细考虑增长的来源，就能发现指数增长是不可能实现的，并且衰减通常来得非常快、衰减幅度也会非常大。
@@ -307,7 +306,7 @@
假设农机厂依赖机床来进行农具的生产，一台机床在 1 期可以产出 1 台农具。机床是高精尖产物，每期只能生产一台。那么就有在 t 期的农机保有量=t + t-1 + t-2 + t-3 + ... + 1 = (t + t^2)/2，是一个二次函数。面粉产量与 t 的关系也是一个二次函数。而当我们用指数增长与二次函数的增长速度相比较时，就会发现在早期，指数函数增长总比二次函数慢一些，而在之后，指数函数的增长速度会大幅超过二次函数。
## 经济繁荣周期
### 经济繁荣周期
在本节的最后，来考虑一下竞技是如何变得繁荣的。
@@ -327,7 +326,7 @@
从上述讨论中不难发现，经济系统实际上并没有自限性地防止价格过度上涨的机制，而通常在经济繁荣周期结束后，也没有让价格对应下调的机制。这意味着在经济繁荣周期结束后，经济体通常会进入滞涨周期。在滞涨周期中，资产的价格长期维持高位，人们通过发展生产力、再分配等手段来促进价格体系回归正常，因此，滞涨周期也可以理解为价格体系的修复周期。
## 下一篇&本篇总结
### 下一篇&本篇总结
在本篇中，我们简单建立了一个经济系统的模型。并利用这个模型，演示了现实生活中发生的各种事件和其对系统的影响。

81
9.计算机网络/9.1计网速通.md
View File

@@ -1,4 +1,4 @@
# 9.1计网速通
# 9.1 计网速通
> Author: 柏喵樱
>
@@ -6,7 +6,7 @@
计算机网络是一个非常复杂的系统。在这一章节中，系统的底层实现将被隐去，只留下暴露给用户的内容。
这一章节为 Web 开发入门设计，用于速通 Web 开发和计网的交叉知识，故命名为 “计网速通”。
这一章节为 Web 开发入门设计，用于速通 Web 开发和计网的交叉知识，故命名为“计网速通”。
## IP 地址与端口
@@ -14,15 +14,15 @@
如你所见，上面一串字符表示一个 IP 和端口，他的格式是 `IP:端口`
IP 是一个由小数点分割成四段的序列，每段数字的取值为 $[0,255]$ , 在上面的示例中，IP是`1.1.1.1`
IP 是一个由小数点分割成四段的序列，每段数字的取值为 $[0,255]$ , 在上面的示例中，IP 是`1.1.1.1`
而端口是一个数字，取值范围是$[0,65535]$ , 在上面的示例中，端口是`80`
所有在互联网上的计算机都会被分配到一个IP，用于标识自己。
所有在互联网上的计算机都会被分配到一个 IP，用于标识自己。
现在先抛开具体的实现方式不提，给你一个既定的事实: 互联网能够将数据从一个IP地址传递到另一个任意的IP地址。
现在先抛开具体的实现方式不提，给你一个既定的事实：互联网能够将数据从一个 IP 地址传递到另一个任意的 IP 地址。
现在你已经知道了怎样使用互联网传送数据，先不讨论怎么说，**理论上说只需要知道对方的IP，给他发数据就可以了**。
现在你已经知道了怎样使用互联网传送数据，先不讨论怎么说，**理论上说只需要知道对方的 IP，给他发数据就可以了**。
### 那么端口是干什么用的呢？
@@ -38,33 +38,33 @@ IP 是一个由小数点分割成四段的序列，每段数字的取值为 $[0,
`1.1.1.1:54321 -> 2.2.2.2:12345`
即，将数据从1.1.1.1的54321端口发送到2.2.2.2的12345端口
即，将数据从 1.1.1.1 的 54321 端口发送到 2.2.2.2 的 12345 端口
可以说这个数据包有以下属性
- 源IP 1.1.1.1
- 源 IP 1.1.1.1
- 源端口 54321
- 目的IP 2.2.2.2
- 目的 IP 2.2.2.2
- 目的端口 12345
## TCP 与 UDP
TCP 和 UDP 两个协议的具体实现都是由操作系统提供的，应用程序发送TCP包和UDP包一般都是使用操作系统的API发送的，所以我们无需关系这两个协议的具体实现细节。
TCP 和 UDP 两个协议的具体实现都是由操作系统提供的，应用程序发送 TCP 包和 UDP 包一般都是使用操作系统的 API 发送的，所以我们无需关系这两个协议的具体实现细节。
下面通过表格对比两个协议来告诉大家如何选择去使用哪一个协议。
||TCP|UDP|
|---|---|---|
|可靠性|有|无|
|速度|慢|快|
|可靠性 | 有 | 无 |
|速度 | 慢 | 快|
表格很小，但是最本质的区别就是这些了。
TCP的最大特点就是**可靠交付**，他有一个ACK确认机制，简单来说就是对于发送的数据，如果没有收到对方的ACK确认收到，他会不断尝试重发，直到他认为无法送达。
TCP 的最大特点就是**可靠交付**，他有一个 ACK 确认机制，简单来说就是对于发送的数据，如果没有收到对方的 ACK 确认收到，他会不断尝试重发，直到他认为无法送达。
UDP和TCP虽然经常一起被提起，也确实属于互联网的同一个层，但从他们的复杂度看，他们并不是两个对等的协议。比起TCP有一套非常复杂的算法实现可靠交付流量控制等协议，UDP真的就是单纯发了一个数据包过去，然后什么也不管。
UDP 和 TCP 虽然经常一起被提起，也确实属于互联网的同一个层，但从他们的复杂度看，他们并不是两个对等的协议。比起 TCP 有一套非常复杂的算法实现可靠交付流量控制等协议，UDP 真的就是单纯发了一个数据包过去，然后什么也不管。
不过不用担心，大家也没多少机会直接接触这两个协议，还是接触HTTP居多。如果真的需要做出选择，除非你知道你在做什么，选TCP。
不过不用担心，大家也没多少机会直接接触这两个协议，还是接触 HTTP 居多。如果真的需要做出选择，除非你知道你在做什么，选 TCP。
现在，你应该知道，虽然你不知道具体怎么做，但是从理论上说，你可以选择其中一种协议发送数据到另一台联网的计算机的某个端口上。
@@ -78,7 +78,7 @@ DNS(Domain Name System) 域名系统
对于日常使用，如果我要打开一个网页，我会选择使用比如`bilibili.com`这样的东西，这一串字符叫做**域名**
域名的最直观用途是代替你记忆 IP 地址，当你访问 `bilibili.com` 这个网址的时候，一般首先会调用操作系统API，操作系统会代替你发送域名解析请求到 DNS 服务器，最后DNS服务器会返回给你域名对应的IP地址。
域名的最直观用途是代替你记忆 IP 地址，当你访问 `bilibili.com` 这个网址的时候，一般首先会调用操作系统 API，操作系统会代替你发送域名解析请求到 DNS 服务器，最后 DNS 服务器会返回给你域名对应的 IP 地址。
其实你也可以拥有自己的域名这很简单。如果你要搭建你自己的网站，购买域名是逃不掉的，在国内的话还需要备案。
@@ -86,9 +86,9 @@ DNS(Domain Name System) 域名系统
如上图所示，一个域名有很多不同的解析类型，但是目前你只需要知道 A 记录是什么。
A 记录是目前互联网上最主要的记录类型，他的记录值是一个 IPv4 地址（就是上述的IP，v4是版本号）。
A 记录是目前互联网上最主要的记录类型，他的记录值是一个 IPv4 地址（就是上述的 IP，v4 是版本号）。
举个例子，域名`aaa.bbb.cn`做 A 解析到 `1.1.1.1`，我们需要设置:
举个例子，域名`aaa.bbb.cn`做 A 解析到 `1.1.1.1`，我们需要设置：
- 主机记录 aaa
- 记录类型 A
@@ -99,16 +99,15 @@ A 记录是目前互联网上最主要的记录类型，他的记录值是一个
## HTTP
HTTP 协议用于 WEB 服务器，一般多见于浏览器获取网页内容。浏览器会用 HTTP 协议发送 HTTP 请求到服务器，服务器处理 HTTP 请求并返回 HTTP 响应。很多的APP，小程序和电脑上的应用程序都在广泛地使用HTTP
HTTP 协议用于 WEB 服务器，一般多见于浏览器获取网页内容。浏览器会用 HTTP 协议发送 HTTP 请求到服务器，服务器处理 HTTP 请求并返回 HTTP 响应。很多的 APP，小程序和电脑上的应用程序都在广泛地使用 HTTP
HTTP 协议有不少版本，现在互联网上最流行的是 HTTP/1.1 版本，浏览器一般最高支持 HTTP/2.0,最新版本是 HTTP/3.0,下面只讨论 HTTP/1.1
HTTP 的底层是 TCP ，他基于此规定了一套文本格式，用于表达一些信息
HTTP 的底层是 TCP，他基于此规定了一套文本格式，用于表达一些信息
单纯说说是说不明白的，HTTP 报文分请求和响应两种格式，下面给出实例
> 如果你有兴趣做 HTTP 抓包，推荐用 Yakit ，本人实习正在做这个产品，也欢迎反馈bug
> 如果你有兴趣做 HTTP 抓包，推荐用 Yakit，本人实习正在做这个产品，也欢迎反馈 bug
### 请求
@@ -151,13 +150,13 @@ start_ts=1690809334&mid=74145050&aid=998480789&cid=1195467370&type=3&sub_type=0&
分别对应查，增，改，删四个动作，这四个动作统称增删查改，英文 CRUD（Create Read Update Delete）
其中，一般来说 GET 和 DELETE 两个请求方法是不带负载(后面有讲什么是负载)的，但这也不是硬性规定。
其中，一般来说 GET 和 DELETE 两个请求方法是不带负载 (后面有讲什么是负载) 的，但这也不是硬性规定。
如果你从浏览器地址栏打开一个网页，那么他首先会向对面服务器发送一个 GET 请求，而其他类型的请求往往是网页加载过程中js脚本向服务器获取数据所带来的的。
如果你从浏览器地址栏打开一个网页，那么他首先会向对面服务器发送一个 GET 请求，而其他类型的请求往往是网页加载过程中 js 脚本向服务器获取数据所带来的的。
#### 请求路径 HTTP版本号
#### 请求路径 HTTP 版本号
早期的 Web 服务器采用纯静态+文件目录结构，这其实相当于说暴露一个文件夹在互联网上，然后大家使用文件路径获取这个文件夹中的一个特定的文件。
早期的 Web 服务器采用纯静态 + 文件目录结构，这其实相当于说暴露一个文件夹在互联网上，然后大家使用文件路径获取这个文件夹中的一个特定的文件。
这个格式一直以来都得到了沿用，现代的路径早已经失去了这个固定意义，成为了一种分类和标识。
@@ -165,9 +164,9 @@ start_ts=1690809334&mid=74145050&aid=998480789&cid=1195467370&type=3&sub_type=0&
`/shell?cmd=ls&a=b`
这种写法只是一种所有人都遵循的格式，这样的路径带2个参数，第一个名字叫`cmd`，参数的值是`ls`，第二个名字叫`a`，参数的值是`b`。
这种写法只是一种所有人都遵循的格式，这样的路径带 2 个参数，第一个名字叫`cmd`，参数的值是`ls`，第二个名字叫`a`，参数的值是`b`。
如果出现字符冲突，比如你需要一个参数值为`&`的参数，可以使用URL编码，写成`%26`，这是`%+16进制ascii码`的格式。
如果出现字符冲突，比如你需要一个参数值为`&`的参数，可以使用 URL 编码，写成`%26`，这是`%+16进制ascii码`的格式。
这一行最后跟一个 HTTP 版本号
@@ -177,7 +176,7 @@ start_ts=1690809334&mid=74145050&aid=998480789&cid=1195467370&type=3&sub_type=0&
一行一个请求头，不同的请求头有不用的用途，广泛认可的请求头有
- Host 主机名,也就是域名，如果使用IP访问，这里会写成IP
- Host 主机名，也就是域名，如果使用 IP 访问，这里会写成 IP
- Content-Type 表示 Payload 的内容格式
- User-Agent 发 HTTP 包的人用的浏览器类型和版本号
- Cookie 用于存储认证信息等，由服务器设置，浏览器每次请求都会携带
@@ -188,9 +187,9 @@ start_ts=1690809334&mid=74145050&aid=998480789&cid=1195467370&type=3&sub_type=0&
#### 负载（payload）
上面的实例是一个 application/x-www-form-urlencoded 类型的 payload ，这由 Content-Type 规定。他的格式和请求参数是一致的。
上面的实例是一个 application/x-www-form-urlencoded 类型的 payload，这由 Content-Type 规定。他的格式和请求参数是一致的。
负载还有很多种不同的格式，比如 json，xml，form-data Web开发那一块应该会讲，这里就不提了。
负载还有很多种不同的格式，比如 json，xml，form-data Web 开发那一块应该会讲，这里就不提了。
### 响应
@@ -242,15 +241,15 @@ Content-Length: 51
其他和请求头基本一致不做讲解
#### 负载(payload)
#### 负载 (payload)
这是一个 json 格式的负载，具体参考 Web开发章节
这是一个 json 格式的负载，具体参考 Web 开发章节
## TLS
现在大多数的网址都会使用 HTTPS 协议而不是 HTTP，其区别在于，HTTP 是把上面提到的报文直接放在 TCP 里传输，此时如果有人抓包获取了你的报文，他是可以看到完整内容的。为了安全，TLS诞生了。
现在大多数的网址都会使用 HTTPS 协议而不是 HTTP，其区别在于，HTTP 是把上面提到的报文直接放在 TCP 里传输，此时如果有人抓包获取了你的报文，他是可以看到完整内容的。为了安全，TLS 诞生了。
HTTPS 的本质就是在将 HTTP 报文通过 TLS 进行发送，而不是直接通过TCP发送。
HTTPS 的本质就是在将 HTTP 报文通过 TLS 进行发送，而不是直接通过 TCP 发送。
TLS 建立在 TCP 的基础上，他会通过加密来确保传输过程中数据的安全。
@@ -274,14 +273,14 @@ TLS 建立在 TCP 的基础上，他会通过加密来确保传输过程中数
| POP3 | 110 | TCP |
| HTTPS | 443 | TCP |
| Mysql | 3306 | TCP |
| RDP | 3389 | 默认UDP |
| RDP | 3389 | 默认 UDP |
| Redis | 6379 | TCP |
## 公网与内网 --- 真实环境分析
基本的内容介绍的差不多了，下面分析一个简单的网络案例，顺带介绍公网和内网的概念。
相信在看这篇文章的大家都正在使用互联网，如果你正在使用windows设备，你可以先按 `win`+`R` ，输入 `cmd`，在弹出的窗口输入 `ipconfig` 你可以看到里面有一串类似于下文的内容：
相信在看这篇文章的大家都正在使用互联网，如果你正在使用 windows 设备，你可以先按 `win`+`R` ，输入 `cmd`，在弹出的窗口输入 `ipconfig` 你可以看到里面有一串类似于下文的内容：
```powershell
无线局域网适配器 WLAN:
@@ -309,15 +308,15 @@ IPv4 地址一栏有一个形似 `192.168.XXX.XXX`的地址，这是一个典型
- 家庭和寝室网络子网掩码默认 `255.255.255.0`
- 默认网关是路由器在内网的 IP，你的设备需要路由器的帮助将数据包从内网转发到公网
此刻你可能会有一个疑问，作为一台联网的计算机设备，我可以把数据发送到公网的服务器上，因为我知道他的公网IP，而且这是独一无二的，只要我联网，互联网上的路由设备会尽力帮我把数据送到地方。
此刻你可能会有一个疑问，作为一台联网的计算机设备，我可以把数据发送到公网的服务器上，因为我知道他的公网 IP，而且这是独一无二的，只要我联网，互联网上的路由设备会尽力帮我把数据送到地方。
### 但是，返回的数据该怎么办？
显然，对面不可能把数据包发给一个内网地址，他只有发给一个公网地址，互联网上的路由设备才知道他要去哪，才能帮他将数据送到地方。
问题的答案很简单，我们的路由器，他通过 PPPoE 拨号的方式向运营商拿到了一个公网IP。他在把数据包转发到互联网上前，做了一个网络地址转换的操作，把数据包的源地址替换成了他的公网IP，再找了一个随机端口号，在那里将修改后的数据发送到公网，**这个转换的操作会被路由器记录**。
问题的答案很简单，我们的路由器，他通过 PPPoE 拨号的方式向运营商拿到了一个公网 IP。他在把数据包转发到互联网上前，做了一个网络地址转换的操作，把数据包的源地址替换成了他的公网 IP，再找了一个随机端口号，在那里将修改后的数据发送到公网，**这个转换的操作会被路由器记录**。
这样，公网上的服务器在收到数据包后也能知道，这个包来自于哪个公网IP的哪个端口，回复的时候就知道发到什么地方了。
这样，公网上的服务器在收到数据包后也能知道，这个包来自于哪个公网 IP 的哪个端口，回复的时候就知道发到什么地方了。
路由器拿到公网上的服务器回复的数据包后，可以根据做网络地址转换时的记录，逆向推导出他应该将包发送到内网的哪台机器的哪个端口，就完成了数据的收发。
@@ -330,7 +329,7 @@ IPv4 地址一栏有一个形似 `192.168.XXX.XXX`的地址，这是一个典型
- 安全，只有你主动连接才能拿到回复，互联网上的设备无法主动访问你的设备
- IPv4 不够用啦
### 其他特殊IP地址
### 其他特殊 IP 地址
- 127.0.0.1 本机，用于自己的设备给自己的设备另一个端口发送数据
- 169.254.x.x 保留地址，向路由器获取内网地址前会临时使用这个地址，如果你发现你的电脑正在使用这个地址，路由器可能坏了

25
9.计算机网络/9.2.3.1IP协议.md
View File

@@ -1,4 +1,4 @@
# IP协议
# IP 协议
> Author: 柏喵樱
>
@@ -6,7 +6,7 @@
## IP 协议数据包结构
IP 协议是网络层最主要的协议，几乎所有的上层数据包都需要IP协议的承载，我们网络层的第一块内容将从 IP 协议讲起。
IP 协议是网络层最主要的协议，几乎所有的上层数据包都需要 IP 协议的承载，我们网络层的第一块内容将从 IP 协议讲起。
下图展示了 IP 协议的报文头部格式，这张图每行代表 32 个 bit，也就是 4 个字节（byte）。如果不计算 Options 这种可选项的话，IP 协议的报头长度为 20 个字节。
@@ -30,13 +30,14 @@ IP 协议是网络层最主要的协议，几乎所有的上层数据包都需
+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+
Example Internet Datagram Header
</pre>
## 版本
第一个字段是IP协议版本号，用于标识IPv4和IPv6两个版本，这两个版本的报文格式是不同的。上图展示的是 IPv4 的报文格式
第一个字段是 IP 协议版本号，用于标识 IPv4 和 IPv6 两个版本，这两个版本的报文格式是不同的。上图展示的是 IPv4 的报文格式
## IHL（Internet Header Length）
## IHL (Internet Header Length)
就是IP协议的头部部分的长度，单位是 4byte，由于 IP 头一般长度为 20byte，所以这个值一般为 5。如果存在Options字段，这个值会相应增加。
就是 IP 协议的头部部分的长度，单位是 4byte，由于 IP 头一般长度为 20byte，所以这个值一般为 5。如果存在 Options 字段，这个值会相应增加。
## Type of Service
@@ -61,17 +62,17 @@ Total Length 很好理解就是包括 IP 头在内的 IP 报文的总长度，
对于第二个问题，引入了 Fragment Offset（分片偏移量），他的单位是 byte，用于标识这一个分片的数据，是从原来超长负载的哪个位置开始的。比如对于一个长度为 5000 bytes 的负载，他的几个分片的 Fragment Offset 依次为 0,1480,2960,4440。在收到数据后，服务器只需要按照这个字段重新组装即可。
对于第一个问题，引入了 Flags（标志位）, Flags 里有三个 Flag，其中最后一位的意义是“后面还有更多分片“，这就相当于告诉服务器，你要继续等待接收其他分片。而当最后的分片抵达时，服务器在知道这是最后的分片的同时，他也能从这个分片的 Fragment Offset里得知前面应该有多少数据，如果缺失，服务器也能继续等待接收。
对于第一个问题，引入了 Flags（标志位）, Flags 里有三个 Flag，其中最后一位的意义是“后面还有更多分片“，这就相当于告诉服务器，你要继续等待接收其他分片。而当最后的分片抵达时，服务器在知道这是最后的分片的同时，他也能从这个分片的 Fragment Offset 里得知前面应该有多少数据，如果缺失，服务器也能继续等待接收。
关于Flags的其他两位，最高位是目前保留不使用，永远为0。后面那位的意义是不要分片，这一般是不设置的，他这句话是对传输过程中的路由设备讲的，因为如果途径 MTU 低于当前包长度的链路可能会进行二次分片。如果设置了这个 Flag，转发时再碰到 MTU 低的链路这种包会被直接丢弃同时返回一个 ICMP 包告诉源IP地址的设备发生了什么。
关于 Flags 的其他两位，最高位是目前保留不使用，永远为 0。后面那位的意义是不要分片，这一般是不设置的，他这句话是对传输过程中的路由设备讲的，因为如果途径 MTU 低于当前包长度的链路可能会进行二次分片。如果设置了这个 Flag，转发时再碰到 MTU 低的链路这种包会被直接丢弃同时返回一个 ICMP 包告诉源 IP 地址的设备发生了什么。
## TTL(Time To Live)
TTL 是一个unsigned int，代表数据包的剩余生存时间，指的是数据包在互联网中还能转发多少时间，单位是秒。
TTL 是一个 unsigned int，代表数据包的剩余生存时间，指的是数据包在互联网中还能转发多少时间，单位是秒。
虽然单位是秒，但是一般情况下转发耗时是远远低于一秒的，根据 IP 协议的规定，无论转发耗时多少，TTL 应当至少 -1，所以在实践中 TTL 往往指的是转发了几次。
一般发往互联网的数据包初始 TTL 为 64 或 128，你可以试试 ping 命令，他会显示一个TTL，这是对面服务器回复的包到自己的设备的时候的 TTL。
一般发往互联网的数据包初始 TTL 为 64 或 128，你可以试试 ping 命令，他会显示一个 TTL，这是对面服务器回复的包到自己的设备的时候的 TTL。
```powershell
PS C:\Users\bs> ping baidu.com
@@ -107,7 +108,7 @@ PS C:\Users\bs> ping baidu.com -i 2
traceroute 就是利用这个性质来实现的，通过从 0 开始遍历 TTL 的方式，可以拿到转发过程中的所有路由器的 ICMP 回复，从这些回复中可以读取到这些路由器的 IP。
当然 traceroute 不是万能的，真实互联网中广泛存在拦截，不响应 ，改写等等行为，会导致 traceroute 产生丢失或者藏跳等等比较迷惑的结果。
当然 traceroute 不是万能的，真实互联网中广泛存在拦截，不响应，改写等等行为，会导致 traceroute 产生丢失或者藏跳等等比较迷惑的结果。
```powershell
PS C:\Users\bs> TRACERT.EXE bilibili.com
@@ -164,8 +165,7 @@ PS C:\Users\bs> TRACERT.EXE bilibili.com
注意，由于 TTL 在每次转发中都会改变，所以实际上，每次转发都会重新计算校验和。
## IP地址
## IP 地址
正如上图的 `Source Address` 和 `Destination Address` 字段所展示的一样，一个 IP 地址占用 4 byte 的存储空间。在书面的写法上，我们用 `.` 将每一个 byte 分割开，例如 `1.1.1.1` 这样更便于人类处理和分类。
@@ -177,7 +177,6 @@ PS C:\Users\bs> TRACERT.EXE bilibili.com
可选参数（Options）比较繁琐，一般没啥用，有兴趣的可以看看下面参考资料中 RFC 791 对此的描述。
## 参考资料
- [RFC 791 - Internet Protocol (ietf.org)](https://datatracker.ietf.org/doc/html/rfc791)

54
9.计算机网络/9.2.3.2子网与无类域间路由.md
View File

@@ -4,7 +4,7 @@
你只需要知道一件事 —— IP 头里有一对 IP 地址，分别分别代表这个数据包从哪里来，到哪里去。
在组成一个比较大的网络前，我们需要给一个个孤立的IP地址分类。给 IP 分类可以让维护路由表变得更简单，CIDR（无类域间路由）是一种非常良好的分类方法。
在组成一个比较大的网络前，我们需要给一个个孤立的 IP 地址分类。给 IP 分类可以让维护路由表变得更简单，CIDR（无类域间路由）是一种非常良好的分类方法。
## CIDR
@@ -70,31 +70,31 @@ baimeow@server:~$ ip addr
严格意义上说，上面提到的子网一部分应该改称呼为网段，简单起见不细究了。
## 常见保留IP
## 常见保留 IP
了解一下常见的保留IP吧，这些保留 IP 不会出现在公网，而是被用于其他特殊用途。
了解一下常见的保留 IP 吧，这些保留 IP 不会出现在公网，而是被用于其他特殊用途。
让我抄一下Wiki的表格。
让我抄一下 Wiki 的表格。
| 地址块 ([CIDR](https://zh.wikipedia.org/wiki/无类别域间路由)) | 范围 | 地址数 | 效用域 | 用途 |
| :----------------------------------------------------------: | :---------------------------: | :---------: | :------: | :----------------------------------------------------------: |
| 0.0.0.0/8 | 0.0.0.0 – 0.255.255.255 | 16,777,216 | 软件 | 用于广播信息到当前主机。[[1\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-1) |
| 10.0.0.0/8 | 10.0.0.0 – 10.255.255.255 | 16,777,216 | 专用网络 | 用于[专用网络](https://zh.wikipedia.org/wiki/专用网络)中的本地通信。[[2\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1918-2) |
| 100.64.0.0/10 | 100.64.0.0 – 100.127.255.255 | 4,194,304 | 专用网络 | 用于在[电信级NAT](https://zh.wikipedia.org/wiki/电信级NAT)环境中服务提供商与其用户通信。[[3\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-3) |
| 127.0.0.0/8 | 127.0.0.0 – 127.255.255.255 | 16,777,216 | 主机 | 用于到本地主机的[环回地址](https://zh.wikipedia.org/wiki/IPv4#环回地址（Loopback_Address）)。[[4\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-4) |
| 169.254.0.0/16 | 169.254.0.0 – 169.254.255.255 | 65,536 | 链路 | 用于单链路的两个主机之间的[链路本地地址](https://zh.wikipedia.org/wiki/链路本地地址)，而没有另外指定IP地址，例如通常从[DHCP](https://zh.wikipedia.org/wiki/动态主机设置协议)服务器所检索到的IP地址。[[5\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-5) |
| 172.16.0.0/12 | 172.16.0.0 – 172.31.255.255 | 1,048,576 | 专用网络 | 用于[专用网络](https://zh.wikipedia.org/wiki/专用网络)中的本地通信。[[2\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1918-2) |
| 192.0.0.0/24 | 192.0.0.0 – 192.0.0.255 | 256 | 专用网络 | 用于IANA的IPv4特殊用途地址表。[[6\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5736-6) |
| 192.0.2.0/24 | 192.0.2.0 – 192.0.2.255 | 256 | 文档 | 分配为用于文档和示例中的“TEST-NET”（测试网），它不应该被公开使用。[[7\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5737-7) |
| 192.88.99.0/24 | 192.88.99.0 – 192.88.99.255 | 256 | 互联网 | 用于[6to4](https://zh.wikipedia.org/wiki/6to4)[任播](https://zh.wikipedia.org/wiki/任播)中继。[[8\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-8)（已废弃[[9\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc7526-9)） |
| 192.168.0.0/16 | 192.168.0.0 – 192.168.255.255 | 65,536 | 专用网络 | 用于[专用网络](https://zh.wikipedia.org/wiki/专用网络)中的本地通信。[[2\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1918-2) |
| 198.18.0.0/15 | 198.18.0.0 – 198.19.255.255 | 131,072 | 专用网络 | 用于测试两个不同的子网的网间通信。[[10\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-10) |
| 198.51.100.0/24 | 198.51.100.0 – 198.51.100.255 | 256 | 文档 | 分配为用于文档和示例中的“TEST-NET-2”（测试-网-2），它不应该被公开使用。[[7\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5737-7) |
| 203.0.113.0/24 | 203.0.113.0 – 203.0.113.255 | 256 | 文档 | 分配为用于文档和示例中的“TEST-NET-3”（测试-网-3），它不应该被公开使用。[[7\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5737-7) |
| 224.0.0.0/4 | 224.0.0.0 – 239.255.255.255 | 268,435,456 | 互联网 | 用于多播。[[11\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1112-11) |
| 0.0.0.0/8 | 0.0.0.0 – 0.255.255.255 | 16,777,216 | 软件 | 用于广播信息到当前主机。[[1]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-1) |
| 10.0.0.0/8 | 10.0.0.0 – 10.255.255.255 | 16,777,216 | 专用网络 | 用于[专用网络](https://zh.wikipedia.org/wiki/专用网络)中的本地通信。[[2]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1918-2) |
| 100.64.0.0/10 | 100.64.0.0 – 100.127.255.255 | 4,194,304 | 专用网络 | 用于在[电信级 NAT](https://zh.wikipedia.org/wiki/电信级NAT)环境中服务提供商与其用户通信。[[3]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-3) |
| 127.0.0.0/8 | 127.0.0.0 – 127.255.255.255 | 16,777,216 | 主机 | 用于到本地主机的[环回地址](https://zh.wikipedia.org/wiki/IPv4#环回地址（Loopback_Address）)。[[4]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-4) |
| 169.254.0.0/16 | 169.254.0.0 – 169.254.255.255 | 65,536 | 链路 | 用于单链路的两个主机之间的[链路本地地址](https://zh.wikipedia.org/wiki/链路本地地址)，而没有另外指定 IP 地址，例如通常从[DHCP](https://zh.wikipedia.org/wiki/动态主机设置协议)服务器所检索到的 IP 地址。[[5]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-5) |
| 172.16.0.0/12 | 172.16.0.0 – 172.31.255.255 | 1,048,576 | 专用网络 | 用于[专用网络](https://zh.wikipedia.org/wiki/专用网络)中的本地通信。[[2]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1918-2) |
| 192.0.0.0/24 | 192.0.0.0 – 192.0.0.255 | 256 | 专用网络 | 用于 IANA 的 IPv4 特殊用途地址表。[[6]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5736-6) |
| 192.0.2.0/24 | 192.0.2.0 – 192.0.2.255 | 256 | 文档 | 分配为用于文档和示例中的“TEST-NET”（测试网），它不应该被公开使用。[[7]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5737-7) |
| 192.88.99.0/24 | 192.88.99.0 – 192.88.99.255 | 256 | 互联网 | 用于[6to4](https://zh.wikipedia.org/wiki/6to4)[任播](https://zh.wikipedia.org/wiki/任播)中继。[[8]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-8)（已废弃[[9]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc7526-9)） |
| 192.168.0.0/16 | 192.168.0.0 – 192.168.255.255 | 65,536 | 专用网络 | 用于[专用网络](https://zh.wikipedia.org/wiki/专用网络)中的本地通信。[[2]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1918-2) |
| 198.18.0.0/15 | 198.18.0.0 – 198.19.255.255 | 131,072 | 专用网络 | 用于测试两个不同的子网的网间通信。[[10]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-10) |
| 198.51.100.0/24 | 198.51.100.0 – 198.51.100.255 | 256 | 文档 | 分配为用于文档和示例中的“TEST-NET-2”（测试 - 网 -2），它不应该被公开使用。[[7]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5737-7) |
| 203.0.113.0/24 | 203.0.113.0 – 203.0.113.255 | 256 | 文档 | 分配为用于文档和示例中的“TEST-NET-3”（测试 - 网 -3），它不应该被公开使用。[[7]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc5737-7) |
| 224.0.0.0/4 | 224.0.0.0 – 239.255.255.255 | 268,435,456 | 互联网 | 用于多播。[[11]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc1112-11) |
| 233.252.0.0/24 | 233.252.0.0 - 233.252.0.255 | 256 | 文档 | 分配为用于文档和示例中的“MCAST-TEST-NET”，它不应该被公开使用 |
| 240.0.0.0/4 | 240.0.0.0 – 255.255.255.254 | 268,435,455 | 互联网 | 用于将来使用。[[12\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc6890-12) |
| 255.255.255.255/32 | 255.255.255.255 | 1 | 子网 | 用于受限广播地址。[[12\]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc6890-12) |
| 240.0.0.0/4 | 240.0.0.0 – 255.255.255.254 | 268,435,455 | 互联网 | 用于将来使用。[[12]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc6890-12) |
| 255.255.255.255/32 | 255.255.255.255 | 1 | 子网 | 用于受限广播地址。[[12]](https://zh.wikipedia.org/wiki/保留IP地址#cite_note-rfc6890-12) |
如果需要搭建自己的比如说家庭网络，寝室网络，一般会选择
@@ -104,7 +104,7 @@ baimeow@server:~$ ip addr
此外另外了解一下其他的特殊地址，避免冲突吧
- `169.254.0.0/16` DHCP获取到 IP 前的临时 IP 地址
- `169.254.0.0/16` DHCP 获取到 IP 前的临时 IP 地址
- `192.18.0.0/16` 一些代理软件的透明代理模式会解析域名到这里
- `172.17.0.0/16` Docker 默认网段
@@ -112,19 +112,19 @@ baimeow@server:~$ ip addr
很久很久以前，一群自大的人给 IP 随意地划分了 ABCDE 类。很遗憾，我们仍需要了解一下这个历史包袱。
- A类 0.0.0.0~126.255.255.255 大型网络
- A 类 0.0.0.0~126.255.255.255 大型网络
- B类 128.0.0.0~191.255.255.255中型网络
- B 类 128.0.0.0~191.255.255.255 中型网络
- C类 192.0.0.0~223.255.255.255 小型网络
- C 类 192.0.0.0~223.255.255.255 小型网络
- D类 224.0.0.1-239.255.255.254 多播
- D 类 224.0.0.1-239.255.255.254 多播
- E类 240.0.0.0---255.255.255.255 保留段与广播地址
- E 类 240.0.0.0---255.255.255.255 保留段与广播地址
仅作了解，现今已经不具有实际意义了
## 正在消失的 —— 点分10进制掩码
## 正在消失的 —— 点分 10 进制掩码
当你在 windows 的 cmd 里执行 `ipconfig /all` 时，你可以看到一个点分十进制的掩码。

5
9.计算机网络/9.2.3网络层.md
View File

@@ -6,13 +6,12 @@
本章节是网络层的开篇章节，我们先做两个约定：
- 没有提及IP协议版本，都是IPv4（ IPv6 会单独介绍不详细展开）
- 没有提及 IP 协议版本，都是 IPv4（IPv6 会单独介绍不详细展开）
- 路由表已经配置好了，给IP地址就能发到正确的地方（路由技术参照“路由与交换”章节）
- 路由表已经配置好了，给 IP 地址就能发到正确的地方（路由技术参照“路由与交换”章节）
以上两个约定适用于所有网络层章节。
在链路层我们已经实现了两个直接相连的设备之间的数据收发，也可以在总线类型的网络上完成数据手法，更成熟一点，可以借助交换机来构建一个具有一定规模的中心化网络。
但中心化是有极限的，这必然无法承载这个整个互联网，因此，我们需要再往上一层，定义一个新的概念，IP 地址，并完成实现数据包的转发操作，将互联网推向去中心化。

2
9.计算机网络/9.3路由与交换.md
View File

@@ -1 +1 @@
# 9.3路由与交换
# 9.3 路由与交换

2
9.计算机网络/9.4隧道和代理.md
View File

@@ -1 +1 @@
# 9.4隧道和代理
# 9.4 隧道和代理

2
9.计算机网络/9.5路由佬入门指南.md
View File

@@ -1 +1 @@
# 9.5路由佬入门指南
# 9.5 路由佬入门指南

21
9.计算机网络/9.计算机网络.md
View File

@@ -1,18 +1,18 @@
# 9.计算机网络
> 本模块来自 DN11(Decentralized Network 11)成员倾情奉献，DN11 最初在生活区11号楼群中提出，旨在建立一个跨寝室的大内网。经过一年的发展，已经成为了横跨 11号楼，VidarTeam，杭电助手等群体的中型实验性网络。
> 本模块来自 DN11(Decentralized Network 11) 成员倾情奉献，DN11 最初在生活区 11 号楼群中提出，旨在建立一个跨寝室的大内网。经过一年的发展，已经成为了横跨 11 号楼，VidarTeam，杭电助手等群体的中型实验性网络。
计算机网络无非一句话，将所有计算机设备连起来。
但，跨越全球的网络是何其的庞大，能够将他们连起来是一项巨大的工程。我可以说：Internet是人类这近50年来最伟大的工程。
但，跨越全球的网络是何其的庞大，能够将他们连起来是一项巨大的工程。我可以说：Internet 是人类这近 50 年来最伟大的工程。
本讲义的计算机网络部分共分为5个章节
本讲义的计算机网络部分共分为 5 个章节
## 计算机网络速通
虽然名字看起来像是考前抱佛脚的章节，但他速通的并不是计网这一课程，是做简单Web开发所必须具备的计网知识。
虽然名字看起来像是考前抱佛脚的章节，但他速通的并不是计网这一课程，是做简单 Web 开发所必须具备的计网知识。
在这个章节，我们会讨论到计算机网络的应用层和传输层，重点介绍一些应用层协议。对于传输层，我们只讨论他为Web开发提供了怎样的接口或者说功能。
在这个章节，我们会讨论到计算机网络的应用层和传输层，重点介绍一些应用层协议。对于传输层，我们只讨论他为 Web 开发提供了怎样的接口或者说功能。
上面提到“应用层和传输层”，或许你现在还不知道计算机网络的五层结构（也有其他划分，但是该划分利于学习），这也没关系，在本章节，可以暂时也不需要知道。
@@ -32,9 +32,9 @@
路由与交换的理论知识，并不涉及实践主要应付考试，但为了追求知识体系完整，会比考试内容稍多，但都是理解性质的。其实大家一般也没这个需求，除非专门做运维或者类似方向的开发，大伙都不需要了解具体怎么搭建网络，不会做过多的原理性讲解了。
如果你确实有在真实世界中搭建网络的需求，请移步路由佬入门指南或者拿好你的设备并考虑加入DN11。
如果你确实有在真实世界中搭建网络的需求，请移步路由佬入门指南或者拿好你的设备并考虑加入 DN11。
这里主要讨论一下路由器，交换机，各种路由协议和他们工作的位置，还有NAT，最终把这些东西排排好，给大家一个完整的互联网模型（对比真实互联网做了一些简化，但该有的协议类型都会有）
这里主要讨论一下路由器，交换机，各种路由协议和他们工作的位置，还有 NAT，最终把这些东西排排好，给大家一个完整的互联网模型（对比真实互联网做了一些简化，但该有的协议类型都会有）
## 隧道和代理
@@ -46,23 +46,24 @@
其实真实互联网上充斥着这样的需求，比如异地组网之类的，隧道便应运而生，我们把原始数据包打包在另一个层次比较高的协议中进行传输，用高层的协议来模拟低层的协议。一条虚假的网线（其实不能和网线等价） —— 隧道便诞生了。
代理部分会讲解正向和反向代理，正向代理其实就是一种“隧道”外加上访问目标主机的网络资源的能力，反向代理更多是Web开发带来的需求，比如常见的nginx反向代理。
代理部分会讲解正向和反向代理，正向代理其实就是一种“隧道”外加上访问目标主机的网络资源的能力，反向代理更多是 Web 开发带来的需求，比如常见的 nginx 反向代理。
## 路由佬入门指南
很多人不理解，不理解也罢。
互联网不是一个很cool的东西吗?
互联网不是一个很 cool 的东西吗？
这是一个遍布全球由无数独立个体一个一个连接起来而形成的一张网，这难道不酷吗？
在把网络配通的瞬间，所有的ping包返回了正确的响应，这难道不振奋人心吗？
在把网络配通的瞬间，所有的 ping 包返回了正确的响应，这难道不振奋人心吗？
身在此却能设计出方案，访问到无比遥远的地方的资源，是难道没有意思吗？
有这样的一个群体，我们普遍称呼他们为“路由佬”，他们便是这样一群，沉迷于配网的一群人。
本章节存在的意义和前面的章节不同，并非是教学，而是劝人快去配网，非常重实践，上面讨论的都是简化模型，理想模型，学习模型，再往下就是实验性网络和真实互联网了，这其实已经脱离了该讲义的宗旨了，所以只会概述概述概述。
## 画个饼先
```mermaid