我常常想：要借现实讲些浅的或深的东西。
各位同学好。
Web——或者说，互联网——这个概念我们每个人都知道，然而我却发现现在很多人却对它并不理解。
我记得初中的时候有个老师网课开始前在 QQ 群里发了一篇文章的链接，结果有个同学说打不开链接，看不了。
老师说：“怎么会打不开？”
她回答：“点进去之后 QQ 出现一个大大的蓝色感叹号，提示非官方网页，不可访问。”
这个人是我们班长。我当时听到这番对话震惊了：为什么会有人非得用 QQ 打开链接？QQ 充其量只能预览，离浏览器差得远了。她是不是以为 QQ 是访问“链接”的唯一方式？
那时我才惊觉中国已经处于移动应用时代，许多人的手机上唯一勉强称得上浏览器的东西或许只有一个“百度” app。浏览器作为美国互联网发展初期 desktop-first 时代的产物存在感越来越低，这是技术发展的必然，因为针对系统优化过的移动应用的性能显著地高于网站；但是互联网仍然具有巨大的影响力，而且不具有 QQ 等软件那样的审查和限制；而且它也十分强大，今天我就在用浏览器做着 presentation。
或许这里应该先明确一下：移动应用的数据传输也离不开互联网，但我这里所说的互联网专指为浏览器访问而设计的网站的总集。
那么，让我们来谈谈互联网吧。（切换）
首先，我会简单聊一聊我与 Web 的故事；然后我们会介绍一下当今互联网的两大交互：用户与机器，比如说用户访问网页；机器与机器，比如说社交平台上的机器人；还有它们幕前幕后的原理。（切换）
我从小就对机械和科技有着莫名的着迷。小时候，我让母亲买了热熔胶枪，用家里的瓦楞纸板模仿着视频做各种玩具和装置，并且享受那种拥有的感觉。后来我渐渐意识到了我骨子里的一种渴望——对于创造和拥有的渴望。只可惜那些玩具早已遗失了，然而我渐渐地发现了一种可以永恒的创造——写代码。
我只上过几节 C++ 课，而且只学到了类，这门强类型、显式内存分配的底层语言让我寸步难行；尽管如此，我还是写出了很多小玩意儿。后来我自己读了 MDN 还有其它很多文档，学了 Web 的语言，又从静态的网页写起，一直到 React、Next.js 等现代 Web 框架。
有一件趣事：八年级时我发现并且研究了一下一个与 audio 有关的 Chrome 的 bug，在一个论坛上发了个贴讨论了一下。有个字节跳动的员工发邮件给我说，它们项目组很想要喜欢 audio 技术的资深前端工程师，然后邀请我内推到他们项目组。当然我很委婉地拒绝了。
我就不把我做过的项目都列出来了，只有目的性地说两个；这两个与后面的介绍有十分密切的联系。（切换）
Leaving.Ink，这是我写的一个 blog 平台，每一个用户都可以得到一个独立的子域名。每次 presentation 的材料和文字稿我都会发在上面。我自己觉得这个平台是相当现代的：PWA 是支持的，黑暗模式是实现了的，设计是 responsive 的，不会像许多国内平台那样用电脑访问就会丘峦崩摧。（切换）
Yukimori，下面这个介绍是我自己编的一个俳句，Yukimori 这个名字就来源于这个俳句第一个词和最后一个词。这是我为 Misskey 写的一个 bot。Misskey 是一个 Twitter 风波后崛起的开源社交平台项目，因为开源每个人都可以自己部署一个实例，不同实例间可以相互联通，因其去中心化而有 Twitter 不具有的抗审查性。Misskey 主要是日本人开发的，但开源无国界。我写的这个 bot 会每天清晨和晚上发送一段俳句并根据二十四节气生成季节进度条的图片。（切换）
下面我就来介绍一下：这些网站、机器以及 Web 是如何轰鸣运转的。细枝末节就略去了，讲讲每个人都能听懂的基础。（切换）
这是一个大致的流程，我们稍后会分成不同部分详细介绍。你输入一个链接，或者说 URL，经过一个叫作服务器的据你所知经常和“崩溃”“开小差”等字眼连用的家伙，然后网页就神奇地出现在了你的屏幕上。（切换）
我们先来看看输入的这一串称为 URL 的文本，https 是通信协议，与之相对的是 http。它约束了数据传输的形式，作为一种更加现代的通信协议，利用 https 协议传输的数据是加密的，难以被第三者监听。ewe.leaving.ink 是域名或主机名，它就像门牌号一样，服务器的 IP 地址可以通过主机名被查询到。而 /ink/markdown_syntax 则是路径名，它好比告诉了服务器要取门内的哪个东西。这里它告诉我们要取得 Markdown Syntax 这一文章。
浏览器向对应服务器发送请求，附上路径和本地的属于该网站的 cookie。cookie 主要会存储用于验证用户身份的令牌，功能类似用户的账号和密码，一般是由服务器自动生成的一个或多个长字符串，但具有时效性。cookie 在本地存储和传输过程中均有一定遭受攻击的风险，因而不直接存储密码。（切换）
接下来看看幕后你不熟悉的这些。服务器在接收到数据后根据路径运行对应位置的代码。服务器先需要取得文章，由于程序本身不具备动态地长时间储存数据的功能，所以有了数据库这一系统。目前为止很长一段时间里世界上最流行的数据库是 MySQL，服务器先要和 MySQL 建立连接，证明服务器有权访问，然后通过脚本对数据库进行检索。不过 Leaving.Ink 没有采用传统数据库，自管理的传统数据库运维麻烦、不易扩展、开销繁杂。我们用的是正在兴起的 Cloud Database，通过像 Google Cloud、Amazon Web Service 等云平台统一维护、远程存取的数据库。在取得数据之后，服务器将根据用户 cookie 来验证用户身份并判断其是否有权访问该页面，比如如果文章公开或用户是该私有文章的主人则生成一段含有该文章的 HTML 代码返回给浏览器，否则生成一段含有报错文本的 HTML 返回。这一过程是服务器端渲染，生成的 HTML 还会被浏览器进一步渲染。还有一种情况：如果客户正在请求的是静态资源，例如图片和脚本，而且没有权限校验的话，那么直接传回给客户端。（切换）
浏览器接收到 HTML 后还会继续向服务器请求一些 HTML 中链接到的 CSS、JavaScript 等资源。HTML 主要定义了应该展示什么，如同一颗圣诞树、一串小灯和一堆饰品；而 CSS 主要定义应该如何展示，它把小灯和饰品整齐挂上了圣诞树；JS 则让用户可以与网页进行交互，它就像控制小灯开关的逻辑。（切换）
💥——让我们来看看得到的网页吧。左上角是 logo 图片，它在浏览器接收到 HTML 后才根据 URL 被请求；中间是一段流程图，由于其庞杂性在浏览器端才被 JS 脚本动态渲染；下方提示我们登录以评论，因为我们还没有登录。（切换）
如果我们已经登录，也就是 cookie 中已经有身份信息的话，服务器就会渲染一个留言输入框。当我们按下提交时，浏览器和服务器间发生的交互类似于请求页面时的那样，只不过数据库操作从读取文章变成了写入评论，而返回的内容不再是网页，而是一个含有成功与否的对象。JS 会在后台处理这个对象然后在前台展示一个提示框。
我们甚至可以实操一下。
Leaving.Ink 的布局理念是现代的 Responsive Design，页面通过 CSS 自动伸缩，不会像◼️◼️云那样根据分辨率和浏览器来区分展示页面。（切换）
实际上，你和网页的交互只不过是互联网的冰山一角。在你看不见的幕后，无数的请求在机器之间发送。比如说刚刚提到的向外部数据库请求数据，又比如说接下来要介绍的通过向社交平台公开的端点发送请求来自动发送推文的机器人。像这样的端点我们称为 Web API。我们通过 Yukimori 来看一下机器之间的请求通常是怎样进行的。（切换）
Yukimori 向 Misskey 负责发送推文——Misskey 称其为“note”——的 API 的 URL 发送请求。在我们的例子中，主机名是 submarin.online。再强调一遍，Misskey 不是一个单独的服务器，而是由无数用户部署的实例的集合，就像不同星球组成的星系。我们的 Misskey 服务器是 Submarin。如果你的 bot 账号是在 misskey.io 上注册的话，就应该向 misskey.io 发送请求。/notes/create 是创建新 note 的 API 的路径。
各位不妨思考：我们需要在请求中附带什么数据呢？肯定有 note 的内容，还有什么呢？
在客户端浏览器会自动带上 cookie 供身份校验；在后端我们也要带上证明我们身份的数据，不然谁都可以代表你发布信息了；一般来说是一个事先创建并保存好的有特定权限的 token。API 端点在接收到请求后在数据库中检索 token，判断其有效性；并判断其权限是否包含我们要执行的操作。一切正常则将 note 储存在数据库中，返回成功；否则返回报错信息。还有一些请求的目的是获取数据，例如我们想通过 API 获取某条 note 的信息，那么对应 API 端点就还应返回索取的信息。
这是我们要做的。（切换）可以看一下机器间通信的几个要素。
这是我们得到的。（切换）当我们再次访问 Misskey 时，发送请求、取得数据、渲染网页、返回结果……这条数据库中的新 note 就出现在了你的屏幕上，也出现在了服务器里万千用户的时间轴上，带去季节的大雪连绵、莺飞草长，或荷叶连天、桂花飘香。
于是机器与机器的交互，加上人与机器的交互，构建起了今天气象万千的现代互联网。
我常常惊讶于：（切换）
现代互联网带给了我们什么。
最近十年是互联网飞速发展的十年，我们看到 PWA、Responsive Design 等新兴设计理念逐渐成为现代 Web 开发的标准，便捷、美观和隐私成为了一项基本要求。Cloud、Serverless 代替传统开发模式加快了软件迭代，并让更多想法得以生根发芽。在后 Twitter 时代用户开始拒绝垄断、控制与审查，第一次拥抱了开放的互联网，各个社群在以 Misskey 和 Mastodon 为代表的去中心化社交平台网络中蓬勃发展。不论是程序员、艺术家，还是性少数者等少数群体，都得到了属于自己的一方广阔又自由的天地，互联网实现着联合国的标语：二十一世纪是追求身份认同的时代。
现代互联网扮演的角色已经不仅仅是让全世界与在没有互联网的时代里不可能相遇的人们相遇的工具，更成为了让天涯海角的人们产生心灵上的接触的信使。被视为一项基本人权的知识的自由获取，因互联网上著作权者无私的许可和共享真正变得可能。去中心化网络推动了用户的广泛参与，并进一步保障了公民的基本权利。在战争边缘的时代看到世界的疯狂和荒谬的人们在网上聚到一起，悲歌人性，祈求和平。
让信息与信息，承载着思想与思想，环绕着文明上空飞翔。让这个世界，更加紧密、更加开放。（切换）
我把它称之为：（切换）
互联网的理想。