捏捏学长的扫盲课：基于云服务器的博客搭建(Hexo)
目录
前言
某人当年受到启发说要在学校里开博客搭建活动，但是受制与时间以及学校流程的麻烦，一直没有办下来。为了不让这个想法成为遗憾，故而决定赶紧把活动办下来
课程介绍
👨💻 捏捏学长的扫盲课：基于云服务器的博客搭建(Hexo)
对博客搭建感兴趣，却不知从何入手？无论你是编程小白还是技术小将，来这里了解如何在云服务器上打造属于你的网站吧！从注册服务器到配置部署、从 Markdown 到 Hexo，我们将从零起步，一步步帮你建立自己的博客，轻松展示你的兴趣和才华！快来加入，一起为未来打下技术基础吧！
本课程将涉及的内容
- 服务器的挑选和购买
- Linux 系统的简单使用
- nodejs 环境搭建
- 博客的撰写与部署（基于 Hexo 框架）
时间
大约 3 小时
参加对象
大一大二的同学，无需任何技术基础，只需带上你的好奇心！
需要准备的材料
- 你的电脑（Win，Mac 或 Linux 皆可，活动场地尽量会安排插座）
- 云服务器（需要提前购买，群内有购买指南）
1 服务器的的介绍以及云服务器的选购建议
1.1 什么是服务器？
服务器负责提供现在的几乎全部的网络服务，从 QQ 聊天，校园网站，到游戏，AI 等等，都需要服务器的支持
我们购买服务器能干什么？
- 搭建博客
- 部署网站
- 搭建游戏服务器（MC,terraria）
- 聊天服务器
- 搭建虚拟内网（基于 WireGuard）
- 作为自己的云盘
- QQ 机器人
- 训练自己的 AI
- 搭建自己的 RSS 订阅服务
……
1.2 服务器选购建议
1.2.1 云服务器的配置解读
影响一个服务器的主要性能是：CPU，内存，带宽（流量），硬盘
一个典型的云服务器展示案例如下
- CPU：决定了服务器的计算能力，小服务器常见有 1 核，2 核，4 核等
- 内存：决定了服务器的运行速度，决定服务器同时能跑多少服务，常见有 1G，2G，4G 等
- CPU 和内存一般会放到一起合称规格
- 带宽：决定了服务器的网络传输速度，1M 带宽 = 128kB/s
- 流量：部分服务器会限制每月的流量，比如 100G，1000G
- 硬盘：存放服务器系统以及服务的数据，一般来说服务器系统大小为 5G 左右,如图
- 镜像：服务器的操作系统，常见的有 Ubuntu，CentOS，Debian 等 Linux 发行版，也有 Windows Server 这种
- 类型：不同的运营商会给服务器取不同的名字，比如阿里云的 ECS，华为云的 Flexus 这些产品对不同的业务有些针对性，但对我们来说没有太大的区别
1.2.2 博客服务器配置需求
我们这次按照搭建博客的需求来选购服务器
1 核 1G 的服务器也能跑博客，但是可能会遇到比较明显的性能瓶颈。
1G 内存由于换算关系实际上只有大概 0.9G 左右的内存，系统自带的服务器大概需要 200-300MB 的内存，剩下的内存就不多了
推荐 2 核 2G 的服务器，这种服务器套餐种类也会多一点
带宽选择 1M 的话也可以运行博客，但是会比较慢，以 Hexo 初始博客为例，页面内容大概为 200+kB
这样会导致明显的等待，所以还是建议 2M 带宽起步，考虑到国内带宽价格昂贵，太高的带宽性价比并不高
硬盘的话，基本上都是够的，不用太多考虑
1.2.3 国内主流云服务器提供商一览
最近双十一，部分厂商的活动价格还是挺实惠的
- 华为云
- 阿里云
- 阿里云服务器活动链接
- 阿里云那个 99 元/年的服务器续费也是 99/年，比较实惠，长期使用的话很推荐
- 阿里云有学生 300 元优惠券，可以用于购买服务器（目前测试好像是不能买便宜的服务器了），领取地址
- 腾讯云
其他的话国内还其他云服务器厂商，由于优惠程度和使用体验考虑，暂不介绍，有兴趣可以自己去了解
以下为其他云服务器厂商的活动链接以及推荐的云服务器
1.3 服务器购买
购买服务器的时候会要求你选择服务器类型，这里推荐 Ubuntu 22
具体配置参考如下
华为云
地区选择近一点的，这里选择上海，镜像选择 Ubuntu 22.04 ,其他的基本不用修改
PS:我已经购买了华为云的服务器了，无法打开同样商品的选购页面，所以这里展示的是另外配置的服务器
阿里云
地区选择上海，镜像选择 Ubuntu 22.04 ,其他的基本不用修改
阿里云部分服务器有南京地区的服务器，延迟会更低
腾讯云也类似
然后确认订单就可以了，部分服务器运营商会要求你先实名，按操作做就行了
然后等待服务器初始化，就 OK 了
华为云 Flexus 界面如下
1.4 服务器的设置
1.4.1 获取服务器 ip
服务器初始化完成后，会给你一个服务器的公网 IP 地址，这个 IP 地址就是你的服务器的地址
1.4.2 设置服务器密码
Ubuntu 系列 root 默认是没有密码的，也就不能登陆，需要先手动设置密码
设置密码，然后确定重启
1.4.3 设置服务器防火墙/安全组
防火墙和安全组是用来限制服务器的访问的，用来保护服务器的安全
早期云服务更多使用的是防火墙，但是配置麻烦，想要在多个服务器上配置相同的防火墙规则需要一遍一遍手动配置。安全组是一种更加灵活的方式，设定好一个安全组（防火墙）后，可以直接应用到多个服务器上，省去了重复配置的麻烦
华为云安全组设置
首页登陆 -> 右上角控制台 -> 在我的资源这一栏找到华为云Flexus云服务，点击前往控制台
进入控制台选择实例
进入实例概览，点击服务器操作中的更改安全组，选择新建安全组
进入安全组管理界面，点击创建安全组
名称，描述随意
创建完成后，点击进入管理页面
点击添加规则，具体如下，确定
然后点击快速添加规则，添加如下规则，开放常用端口
创建完成后回到服务器管理界面
刷新之后就能看到刚才的安全组了
选择，确定
验证能否访问
在 cmd(windows) / bash(Linux) 中输入
ping 服务器ip
# 例如 ping 114.44.94.124请把这里的 114.44.94.124 替换成你的服务器 IP，不要照抄！
如果出现如下的输出，说明你的服务器已经可以访问了
PING 114.44.94.124 (114.44.94.124) 56(84) bytes of data.
64 bytes from 114.44.94.124: icmp_seq=1 ttl=52 time=15.9 ms
64 bytes from 114.44.94.124: icmp_seq=2 ttl=52 time=9.54 ms
64 bytes from 114.44.94.124: icmp_seq=3 ttl=52 time=9.54 ms如果一直卡在第一行，说明你的服务器还不能访问，检查一下你的安全组/防火墙设置
2 云服务器的初始化和基本操作
2.1 准备工具
本教程大部分操作使用 VsCode 完成
安装插件，在拓展商店直接搜索（返回的第一个就是）
Chinese (Simplified)：中文插件
remote-ssh：远程连接插件
Markdown All in One：md 编辑插件
重启 Vscode 来应用配置
2.2 连接服务器
点击左边的远程资源管理器
然后点击连接到主机，输入
ssh root@服务器ip如何查看服务器 IP？
在服务器管理页面寻找
x.x.x.x类似的数字串，比如113.56.74.123注意：长相类似
192.168.x.x或者10.x.x.x的是局域网 IP，不是公网 IP
如下图所示
更新 SSH 配置文件这里选择第一项
windows 用户可能选择如下，也是选择第一项
windows 用户会多一个选项 对方服务器 ，选择
Linux
右下角会跳出来配置成功的选项，你也可以在左侧远程资源管理器看到你的服务器
连接服务器
然后输入密码，成功登陆服务器的话如下所示
选择打开文件夹，选择默认的/root就行
选择信任作者
这样你就可以看到服务器上的文件了
这里暂不介绍这些文件有什么用，后续如果开设 Linux 相关的课程的话会详细介绍
2.3 初识服务器
在左边点击新建文件夹，我们新建一个blog文件夹
然后右键点击blog文件夹，选择在终端中打开
会打开命令行环境，如图
你可以用Ctrl + J 快捷键来开启和关闭终端
我们来看一下命令行的这个输出
root@hcss-ecs-b26d:~/blog#root：当前登陆的用户hcss-ecs-b26d：服务器的主机名，由服务器提供商随机生成~/blog：当前所在的目录，~代表用户的家目录，也就是/root#代表当前用户是 root 用户
旁边还有个光标意味着你能够输入什么
尝试 ls ls ../ ls -a ../ 和 clear 命令
对于本文所有的命令，运行的时候请确保终端里面有显示
~/blog这个符号，如果没有请先输入cd ~/blog进入到blog目录
2.4 服务器初始化
2.4.1 更新软件包
运营商给我们提供的服务器是某一个时间的某一个发行版，但是随着时间流逝，开源社区的软件会更新一些版本，所以我们第一件做的事情是把软件包列表更新一下
- 获取最新的软件功能
- 修复软件的漏洞
输入
sudo apt update更新软件包列表，会看到类似如下的输出
安装常用软件
sudo apt install vim openssh-server git lnav tree neofetch \
glances btop zsh ca-certificates curl gnupg -y若运行失败，可以参考在线版本
3 nodejs 环境的搭建
Hexo 框架使用 nodejs 来运行，所以我们需要安装 nodejs
3.1 添加 nodejs 的 APT 源
这一部分比较复杂，第一次接触的花可以不用深入理解，能跑通就行
（可以直接用第三节结尾处的整合代码）
导入 nodejs 源的 GPG 密钥
# 创建存放 GPG 密钥的目录
sudo mkdir -p /etc/apt/keyrings
# 导入 GPG 密钥
curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | \
sudo gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg添加 nodejs 的 APT 源
# 添加 APT 源
echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_22.x nodistro main" | \
sudo tee /etc/apt/sources.list.d/nodesource.list3.2 安装 nodejs
更新并安装 nodejs
sudo apt update
sudo apt install nodejs -y查看 nodejs 和 npm 版本
node --version
npm --versionnpm 是 nodejs 的包管理工具，我们可以使用 npm 来安装一些 nodejs 的包
对于 nodejs 包你可以理解为 C++的库或者头文件，不过是需要下载的
由于 npm 的下载地址在国外，访问特别慢，我们可以设置 npm 的镜像源
# 设置 npm 镜像源为淘宝镜像
npm config set registry https://registry.npmmirror.com第三节代码整合如下
sudo mkdir -p /etc/apt/keyrings
curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | sudo gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg
echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_22.x nodistro main" | sudo tee /etc/apt/sources.list.d/nodesource.list
sudo apt update
sudo apt install nodejs -y
node --version
npm --version
npm config set registry https://registry.npmmirror.com若运行失败，可以参考在线版本
4 Hexo 的安装与配置
Hexo 是一个快速、简洁且高效的博客框架，基于 Node.js 开发，支持 Markdown 语法，可以快速生成静态网页
4.1 安装 Hexo
npm install -g hexo-cli4.2 Hexo 的初始化
# 将当前目录作为博客目录初始化
hexo init ./
# 安装依赖
npm install初始化之后 blog 目录下会多出一些文件，如下
# 以下内容不需要输入到命令行中
.
├── _config.landscape.yml # 竖版主题配置文件
├── _config.yml # 主配置文件
├── node_modules # 依赖包
├── package-lock.json # 依赖包锁定文件
├── package.json # 依赖包配置文件
├── scaffolds # 模板文件
├── source # 博客源文件
└── themes # 主题文件有关
_config.yml的配置可以参考Hexo 官方文档
4.3 启动博客服务器
启动 Hexo 博客服务器
hexo server打开浏览器输入http://服务器ip:4000，就可以看到 Hexo 的默认页面了
如果无法访问，请参考#博客无法访问
5 博客的撰写与启动
编写博客前，我们需要先了解一下 markdown
5.1 Markdown 的基本语法
markdown 是一种轻量级的标记语言，可以快速的将文本转换成 HTML
常用于撰写博客、文档、笔记等
openai 这一类 GPT 模型也会使用 markdown 来输入和输出
在 Hexo 中，我们使用 markdown 来撰写博客，然后 Hexo 会将 markdown 转换成 HTML，展示在网站上，相比于直接编写 HTML，markdown 更加简洁和方便
查看下面的 markdown 代码
# 一级标题
## 二级标题
> 引用
- 无序列表
- 无序列表
- 无序列表
1. 有序列表
2. 有序列表
3. 有序列表
**加粗**
_斜体_
[链接](https://www.baidu.com)
`代码句`
```bash
# 代码块
```上面的 markdown 代码会渲染成如下的效果
因为
标题会影响到整体的排版，所以这里不展示效果
引用
- 无序列表
- 无序列表
- 无序列表
- 有序列表
- 有序列表
- 有序列表
加粗
斜体
代码句
# 代码块markdown 实现了 HTML 中的大部分功能，但是更加简洁，更加易读。更多的 markdown 语法可以参考下面的链接
5.2 添加博客
在 Hexo 中，我们可以使用 markdown 来撰写博客
使用 Hexo 的命令来创建一个新的博客
hexo new "Hello Hexo"然后你就会在 vscode 左边文件管理器的 blog/source/_posts 目录下看到一个Hello-Hexo.md 文件
点击打开编辑文件，然后保存文件，刷新网页
博客更新啦！！
- 如果网页没有刷新请在浏览器使用快捷键
Ctrl+shift+r强制刷新- 如果网页挂了请确保终端的 hexo server 一直在运行
5.3 使用 pm2 部署博客
使用 hexo server 命令启动的博客是在前台运行的，如果关闭终端，博客也会关闭
pm2 是一个进程管理工具，可以让我们在后台运行博客
安装 pm2
npm install -g pm2将博客设置为后台运行，并开始运行
pm2 start hexo --name hexo_blog -- server后台启动博客之后，终端看不到输出，但是博客还是在运行的，你也可以在终端继续运行其他命令
查看博客状态
pm2 status停止博客
pm2 stop hexo_blog重启博客
pm2 restart hexo_blog6 拓展&进阶
虽然博客跑起来了，但是似乎还不能让人满意
- 给博客起个名字，让网页的显示不仅仅是
Hexo四个字 - 网站样式太单调了，我想要更复杂好看的样式
- 我想要自己的域名，而不是输入 ip 访问
- 使用
hexo server的方式太 low 了，我想要更专业的部署方式 - 我想换个博客，类似文档那种
- 我想要能在网页上编辑博客的功能
- 管理我的博客版本，我想要能回滚到之前的版本
- 我想自己写一个博客框架，我想要更多的功能
或许你还想要更多？
- github 使用
- 搭建虚拟内网，在外也能访问家里的设备
- 私人 GPT QQ 问答机器人
- vitepress 在线知识库搭建
- BBS 论坛搭建
- 数据挖掘浅尝
- docker 与虚拟化
- NLP 自然语言处理浅尝
附 1：问题与解决
当你遇到运行失败的时候，请查看终端的输出，看看与下面的问题是否相似
管道错误
在 ssh 连接的时候可能会连接失败并出现类似如下错误
xxxx试图写入的管道不存在xxxx这个问题是 windows 的 ssh 客户端的问题，解决方法可以参考下面的链接
- vscode 远程连接 ssh 问题，试图写入的管道不存在，更改 ssh 位置 | CSDN
- 解决 vscode 远程连接报尝试写入的管道不存在，ssh remote， The process tried to write to a nonexistent pipe. | 知乎
博客无法访问
- 检查浏览器中的地址是否正确，确保是
http开头而不是https开头 - 检查服务器是否开启了 4000 端口，请到服务器管理面板上查看对应端口是否开启
博客没有更新内容
- 刷新网页（浏览器快捷键
Ctrl+shift+r） - 查看服务器上的文件在编辑后是否保存（Vscode 保存快捷键
Ctrl+s） - 重启博客服务器
hexo 初始化失败
报错类似
INFO Validating config
FATAL ~/blog not empty, please run `hexo init` on an empty folder and then copy your files into it
FATAL Something's wrong. Maybe you can find the solution here: https://hexo.io/docs/troubleshooting.html这个问题是因为你的 blog 文件夹不是空的，解决方法是删除 blog 文件夹下的所有文件（请提前备份文件，服务器上没有回收站）
rm -rf ~/blog/*
cd ~/blog附 2：非云服务器方案
如果没有云服务器的话，这里有一些替代方案
华为云电脑
前两天领取的华为云电脑也是可以
进入云电脑，点击下面这个终端工具（Terminal Emulator）
复制下面的代码到终端中
# 更新软件包
sudo apt update
echo "code code/add-microsoft-repo boolean true" | sudo debconf-set-selections
# 安装 wget 和 gpg
sudo apt-get install wget gpg
# 下载微软的 GPG 密钥
wget -qO- https://packages.microsoft.com/keys/microsoft.asc | gpg --dearmor > packages.microsoft.gpg
# 安装 GPG 密钥
sudo install -D -o root -g root -m 644 packages.microsoft.gpg /etc/apt/keyrings/packages.microsoft.gpg
# 添加 vscode 的源
echo "deb [arch=amd64,arm64,armhf signed-by=/etc/apt/keyrings/packages.microsoft.gpg] https://packages.microsoft.com/repos/code stable main" |sudo tee /etc/apt/sources.list.d/vscode.list > /dev/null
# 删除 GPG 密钥
rm -f packages.microsoft.gpg
# 更新软件包列表
sudo apt install apt-transport-https
sudo apt update
sudo apt install code或者参考 Vscode 官方文档
在 Linux 上安装 Visual Studio Code
创建博客文件夹
mkdir ~/blog
cd ~/blog在左边所有应用程序 -> 开发 -> Visual Studio Code 打开 Vscode
然后就可以从第二节开始操作了，需要注意的是：
- 不需要安装
remote-ssh插件 - 跳过
2.2 连接服务器这一步（因为你已经在服务器上了） - 打开文件选择 blog
与在云服务器上不同的是，你只能在云电脑的浏览器中看到你的博客，无法在外部访问，教程中 服务器ip 的地方请用 localhost 代替
本地安装 Hexo
windows 上也是可以安装 Hexo 的，只要需要安装 nodejs 和 git。但是由于 windows 的特性，这个过程将会异常麻烦，如果你不擅长捣鼓电脑，甚至可能会把环境搞得一团糟
在 Linux 只需要敲命令就可以了，在 windows 上要考虑得就多了
所以我建议你们都把 Windows 换成 Linux（推荐 Ubuntu）
- Node.js 安装及环境配置超详细教程【Windows 系统】 | CSDN
- windows 安装 git（全网最详细，保姆教程） | CSDN
- 2022 Hexo 博客搭建和使用教程(Windows) | 知乎