onlinetek-web 笔记

Appearance

给自己写的东西上线 ​

之前大家项目基本都是在本地跑的，只能自己看到，现在大致讲一下怎么上线。

前言 ​

之前应该有提到过 TCP/IP 协议，提到过 ip 地址还有端口的概念，大家大致了解这两个就可以了，详细的内容有兴趣的话可以自行了解。

抽象且不怎么严谨的来说，在网络世界里，知道一台终端的 ip 就相当于知道它的位置，然后就可以和它进行交流。而一台终端设备上可能有很多个服务可以去交流，一般来说服务和具体的端口相对应，知道 ip 和端口就可以和指定设备上的某一个服务进行交流，而 http 协议就是约定了一种交流的格式。

之前在写自己的服务的时候，不管是前端 vite 开发时服务器或者后端，服务跑起来的时候会绑定一个端口，监听某些位置发来的数据，这时候就可以通过对应的手段访问服务（比如浏览器）。但是为什么写的服务只能自己访问的，有的时候可能是因为服务只监听了本地发来的数据（比如 vite dev server 默认监听 127.0.0.1），更多的时候是因为大家没有接入公网。

公网这个概念大家可能以前听说过，可以简单理解成能直接接触到公网的设备都可以直接互相连通。现实世界中的终端设备太多，我们现在广泛用的 ipv4 协议版本不足以分配出这么多的 ip 地址，所以一般会用 nat 转换等技术，分出一个个的局域网，在局域网里重新分配另外一套 ip 地址，而不同层级之间用一些特殊的手段来进行各局域网里面设备的识别和数据交换。举个例子，大家家里基本都有路由器，连接到这个路由器的设备可以是在同一个局域网里，分配同一套 ip 地址，然后小区里很多个路由器都接入了运营商，这些路由器可以是在同一个局域网里，分配另外一套 ip。以此类推，往上可能还有好几层。

这样就导致了，你的服务，必须通过一些手段暴露在公网里，才可以被其它所有人访问到。

一种方法是，租专用的云服务器，这种设备一般都有公网 ip（腾讯云、azure、AWS 等平台）。

一种方法是，将本地的一些端口转发到有公网 ip 的终端上，也就是常说的内网穿透

一种方法是，有的地区的运营商给的宽带是可以直接申请到公网 ip 的，这个限制条件比较多。

一种方法是，直接找托管服务的厂商，让他们提供办法给你上线

还有很多很多方法不一一赘述

我们这里主要讲有服务器和没服务器的方案，对应前三种和后一种

Severless ​

serverless 方案意思就是我们不需要一台完整的服务器，通过把服务托管给对应的厂商来提供

比如托管静态网站，托管数据库等。

这里推荐有免费套餐的一些厂商。

  • github pages: 可以托管静态网站，有一定免费额度。
  • vercel 托管静态网页等，支持 vite、nuxt 等
  • netlify 托管静态网页等
  • supabase 托管 PostgreSQL 数据库
  • railway

更多免费套餐可以去看 https://github.com/255kb/stack-on-a-budget/

一般来说这种服务类型和 Node.js 生态比较贴合一些，包括一些全栈的框架（nuxt, next.js）等，除了静态页面以外，还提供一定的计算能力（云函数之类的叫法）。配合上一些托管数据库的平台，基本可以做到全栈 serverless

server ​

有一台完整的服务器的话灵活性就非常高了，但相对的学习成本也要高一些。（个人认为 serverless 的学习路径应该是在会一定的服务器维护技能之后的）。

这里的服务器平台本文只涉及到 Linux，其他的不介绍也不推荐大家现在就去了解。

Linux 相关知识 ​

由于课时紧张只讲相关重点：

由于我们主要是和服务器打交道，一般来说 Linux 作为服务器来使用是不需要图形化界面的，所有的操作都通过命令行完成，有关图形化相关的内容不会涉及很多。

获取 Linux ​

这里讲到获取 Linux 主要是出于学习目的。

大家的操作系统应该大部分都是 Windows，有 macOS 的话，可能会发现后面讲的一些东西 macOS 里也有，但实际上还是有很多不同的。

Linux 有发行版的概念，对此不了解且不知道如何选择的就直接选 Ubuntu

方式一：想办法获取一台云服务器 ​

获取一台服务器，然后让服务器厂商给你把系统都安装配置好，直接上手用，简单快捷

既然要用人家的设备，当然需要给对面钱，不过好在我们是学生，可以让对面送我们一台。很多国外的云服务厂商有专门提供的学生开发包，只要过了学生认证就可以有一定免费额度。 比如说微软的 Azure 学生订阅可以免费领取一年两台低配服务器和 100 刀的额度，DigitalOcean 学生包送一年 200 刀的额度，更多学生优待可以去 https://education.github.com/pack 这里看看，现在不白嫖将来后悔死。

国外的服务器一般来说会受到线路等问题的影响，在国内网络下访问不是很流畅，但是国外的服务器可以免去繁杂的备案步骤（需要配合国外注册的域名）。

国内的话，一般来说大厂云服务厂商都有对学生专门的优惠，可以自行了解一下，推荐腾讯云。

另外，办公室里有一台电脑装了 Linux 可以当作服务器，校园网内可访问，有兴趣的可以私聊联系我。

如上文提到的，服务器安装好的 Linux 系统一般没有图形界面，如何连接可以看 SSH 这一节

方式二：虚拟机/物理机 ​

本地完整体验 Linux 的方式，大家可以安装 Ubuntu Desktop 版本，就是带图形化界面的版本，官方安装教程在此

讲明白这个挺麻烦的，大家可以自行去网上找教程，装 Ubuntu Desktop 基本就和装 Windows 一样简单，有经验的同学应该看看就会，有困难可以私聊我。

方式三：WSL ​

Windows 下可以安装 Linux 子系统，可以自行了解，不过这种方式和完整 Linux 环境可能有区别。

其它方式 ​

或许有的地方会提供学习用的 Linux 环境，我印象里有，但现在忘了 😛

Shell ​

和服务器连接一般是要通过命令行操作，Shell 几乎是必学，一般 Linux 发行版会自带 Bash 作为默认 Shell，大家可以通过 https://wangdoc.com/bash/ 这个网站学一下，不需要到写脚本的程度。

如何连接到远程服务器的 Shell 可以看 SSH 这一节。

SSH ​

可以看这里 https://wangdoc.com/ssh/ 了解学习一下，也可以自行找其它资料。

安装软件 ​

这里只涉及到 Ubuntu 或者其它使用 aptitude 管理软件包的发行版，而且只有简单的例子

  • 更新可用软件包及其版本列表（推荐在运行其他 apt 命令前首先运行该命令）：

sudo apt update

  • 查找指定软件包：

apt search {软件包}

  • 显示关于指定软件包的信息：

apt show {软件包}

  • 安装指定软件包或将指定软件包更新到最新版本：

sudo apt install {软件包}

  • 移除指定软件包（使用 purge 同时移除其配置文件）：

sudo apt remove {软件包}

  • 将所有已安装软件包更新到最新可用版本：

sudo apt upgrade

  • 列出所有软件包：

apt list

  • 列出已安装的软件包：

apt list --installed

比如我们想要安装 Node.js，可以搜索出它的包名是 nodejs

bash
sudo apt install nodejs

官方软件仓库里的 nodejs 版本可能非常旧，对于 Node.js 的安装我推荐是使用版本管理器，推荐的版本管理器有：

可以看它们的文档找安装用法

推荐无特殊需求的话用官方仓库里的版本。

其它 ​

讲明白 Linux 怎么维护对我来说挺困难的，因为我个人基本没啥知识体系，目前只能到此为止了:(，有问题可以私聊我

部署服务 ​

现在假设你有一台暴露在公网的服务器，下面讲如何公开服务。

防火墙 ​

根据选择的厂商不同，自带的防火墙也不一样。有的防火墙是在服务器里的，就是在你的 Linux 系统层面有一个防火墙程序在运行；有的防火墙可能在网关，需要你要服务器厂商后台控制面板里配置。

前者比较常见的防火墙程序是 firewalld（我猜的），怎么配置可以自行搜索，也可以直接粗暴的关掉它：

bash
# 现在大部分发行版是靠 systemd 来管理后台服务的，包括较新版本的 Ubuntu
sudo systemctl stop firewalld # 停止后台服务
sudo systemctl disable firewalld # 取消开机自启

防火墙里会有一些规则限制端口访问，关掉后会有一些安全隐患。

监听端口 ​

服务器上的服务需要监听对应协议的某个端口，这里比较常见的一个坑是监听地址，一般框架的教程会给你监听 127.0.0.1，这样就只允许本地的连接访问了，改成 0.0.0.0 就好了（不要问为什么，这里写不开）。

静态网页 ​

前端的同学做出来的项目大多都是静态网页，只需要服务静态文件就可以了，需要一个简单的文件 http server

  • python -m http.server：Python 标准库里的 http server，挺简单，貌似不支持并发。
  • darkhttpd：简单的 file server
  • miniserve：简单的 file server
  • NGINX：生产环境推荐 http server，不只是 file sever，不过个人认为配置文件有点复杂，不会讲
  • Caddy：功能强大的 web server，配置比较简单，上课时候会专门讲这个，主要是自动 HTTPS 比较方便
  • Apache：我没怎么用过。

后端服务 ​

一般直接监听端口就可以访问了，记得指定 host 为 0.0.0.0，怎么指定看自己用的什么框架

有一个问题是在 ssh 的会话里跑的服务，ssh 断开连接后就终止了，需要让服务在后台运行，这里提供一些方案：

  • nohup & 挂起
  • tmux
  • Docker
  • systemd unit

涉及到开机自启等需求的话，可以看看后面两种

域名 ​

可以从 https://education.github.com/pack 这里看看有什么可以白嫖的，国内域名+国内主机需要备案，域名可以解析到 ip 地址

HTTPS ​

简单来讲，HTTP 发送数据有些是明文的，不是很安全，HTTPS 在此之上加了一层加密，具体细节写不开，只需要知道现在的互联网没有 HTTPS 基本活不下去（各种意义上）。

关于怎么上 HTTPS，因为主要用到的 web server 是 Caddy，它可以无感知的帮我们处理好 HTTPS，所以可以不用关心，具体细节写不开

HTTPS 是和域名绑定的（有个叫证书的东西），所以要先有域名。

反向代理 ​

反向代理是什么意思呢，大概就是和正向代理是反着的罢！正向代理大概就是你有想访问的服务，通过正向代理可以把你发出的数据全都经由代理服务器发出去。而反向代理，大概就是某个服务对外来请求的接受和响应都会经由代理服务器。 大概就是一个是用户走代理一个是服务走代理。

那为啥需要反向代理呢。我们知道 http 协议的默认端口是 80 而 https 协议默认端口是 443，只有这两种情况是可以省略端口的。 一般来讲，我们可以让带有反向代理功能的 web server 来监听这两个端口，以 Caddy 为例，Caddy 监听 80 和 443 端口，然后你可以配置 Caddy 根据发来请求的 host 和 path 等信息来给路由到不同的服务，这个服务可以是本地的也可以是远程的，具体上课再讲

这样我们就可以不同的服务全部走反向代理，就不需要写端口号了，而且和 HTTPS 相关的都可以在 web server 配置，不需要每个服务都配置一次了

比如说我服务器的结构：

  • lnkkerst.me 直接 Caddy 里配置跳转 blog.lnkkerst.me
  • blog.lnkkerst.me 反向代理到本机的博客服务
  • static.lnkkerst.me 以某个文件夹为根目录开启文件服务器
  • etc.

Caddy ​

文档：https://caddyserver.com/docs/

Docker ​

应用程序容器化方案

Get Started：https://www.docker.com/get-started/

下节课需要大家做的准备 ​

  • 有一台能访问的 Linux 实例，最好是公网能访问的云服务器（可以上课前私聊我临时开一台机子，仅供学习使用，不可用于违法行为，产生后果和我无关:P）

  • 域名(有服务器的话可以联系我给开一条三级域名的记录)

强烈推荐大家去白嫖学生认证 https://education.github.com/pack 这一页的东西，我现在能了解到的是 azure 和 github 还有 jetbrains 是只要还是学生就可以续期的

学生认证可能要提供在读证明等资料

有困难可以联系我