一、前言
之前个人主页一直挂在 coding 上,好久没有看过了,结果发现必须要自有域名才能继续访问。趁着还云服务的学生服务器,和以前买来蹭免费邮件服务器的域名,准备迁移到云服务的 ECS 上。
二、域名及服务器
现在云服务的生态已经非常丰富了,所有工作可以在主流的云服务厂商一站式搞定。这里挂一个我的一个的推广链接,路过的大佬们给个支持呗。
2.1 域名
买域名没什么说的(点击购买),唯一要提的一点是国内域名需要备案,不过很简单,各大厂商都提供一站式服务(点击备案)。之后可以顺便使用证书服务给自己的网站注册一个免费的 SSL 证书(点击注册),方便后续对个人主页进行 https 方面的设置。
- 单个域名-DV 域名级 SSL-免费版
2.2 服务器购买
开发者成长计划对用户还是很友好的,性能上 一核 2G 1M带宽
也够普通用户折腾了。自带公网 IPv4 地址,要是还配 IPv6 地址就再好不过了。(貌似新版服务器已经支持 IPv6,可惜我没有优惠服务器购买资格了,已经转移到腾讯云)我这里买的是 Ubuntu 的操作系统,因为这个用的多,具体用什么 Linux 系统,看自己习惯就好。Windows 就算了,这个配置也够呛能跑动。另外记得开启安全组端口和密钥对。
云服务器管理-网络与安全-安全组-手动添加 80 端口和 443 端口
云服务器管理-网络与安全-密钥对-创建密钥对&绑定密钥对
2.3 服务器配置
服务器购买完成当然是要先配置一番,基础的操作命令就不再说了,由于是 root 权限进入系统,所有的命令就不在带上sudo
了。如果之前已经绑定了密钥对,这里可以直接使用密钥登录服务器。
2.3.1 开放端口
服务器默认是打开防火墙并屏蔽除 ssh 外的各种端口的,这里需要用 Ubuntu 自己的 UFW 命令放行网页服务所需端口。
1 | ufw allow 80/tcp |
2.3.2 安装 nginx
端口开放以后需要配置 nginx 来作为 hexo 运行的服务器,安装并启动的命令如下,nginx 配置的默认路径为/etc/nginx
。
1 | apt install nginx -y |
2.3.3 配置 nginx 网页服务
启动服务后直接访问服务器公网 IP 即可打开 nginx 的默认页面,如果无法打开,请确认安全组和防火墙的设置问题。
打开后第一步可以先在域名解析服务中将刚才已经购买并注册 SSL 证书的域名指向该 IP,然后进入目录/etc/nginx/conf.d
对个人主页的相关服务信息进行配置,首先创建个人主页的配置文件vi hexo.conf
,然后对内容进行修改。
1 | server { |
第一个 server 是用来配置 https,SSL 证书的 pem 文件和 key 文件可以在阿里云的证书控制台中下载,然后上传到服务器的/etc/ssl
目录即可。location 中的 root 路径是个人主页的根地址,之所以是/home/git
是因为之后要对 git 进行操作,完成个人主页的自动部署。
第二个 server 是对 http 访问进行跳转,将所有的 http 请求转换为 https 请求。
如果不需要设置 https,可以按照如下进行设置。
1 | server { |
2.3.4 配置 git
这一块就是为了让我们可以本地编辑完成后直接通过hexo d
命令一键将博文部署到服务器。
通过
adduser git
创建 git 用户,并配置密码。通过
adduser git sudo
授予 git 用户管理员权限。或通过以下代码手动添加权限。1
2
3
4
5
6
7
8
9chmod 740 /etc/sudoers
vi /etc/sudoers
# User privilege specification
root ALL=(ALL:ALL) ALL
git ALL=(ALL:ALL) ALL #添加这一行
# Members of the admin group may gain root privileges
chmod 400 /etc/sudoers对 git 用户进行配置。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24# 切换到git用户
su git
cd ~
# 创建个人主页根目录
mkdir www
cd www
mkdir hexo
# 添加ssl密钥 (authorized_keys文件来自默认登录用户的对应目录)
cd ~
mkdir .ssh
sudo cp /root/.ssh/authorized_keys /home/git/.ssh/
sudo chown git:git /home/git/.ssh/authorized_keys
# 创建git仓库
git init --bare hexo.git
# 添加并赋予hooks执行权限
vi ~/hexo.git/hooks/post-receive
git --work-tree=/home/git/www/hexo --git-dir=/home/git/hexo.git checkout -f
chmod +x ~/hexo.git/hooks/post-receive
至此对服务器的配置已经完成,之后是对本机的 hexo 进行安装和配置。
三、 hexo 版本升级
由于好久没有更新过个人主页,电脑在此期间也经历过重装系统,所以一切配置都要从头再来。电脑环境为 Windows,后续安装都是基于 Windows 10。
3.1 配置 NodeJS
3.1.1 下载
下载安装包,我这里通过清华大学的镜像站进行下载。这里选择的是绿色免安装版,后续需要对环境变量进行设置。
3.1.2 配置环境变量
首先将文件解压缩到自己指定的目录,然后再用户环境变量中添加NODE_HOME
,变量指向 NodeJS 解压目录。然后在用户的 path 中添加%NODE_HOME
和%NODE_PATH%\node_global
。
3.1.3 修改 npm 包安装位置
在 NodeJS 解压目录中建立node_global
及node_cache
两个文件夹。然后执行命令:
1 | # 将'NodeJS解压目录'替换为自己的实际目录 |
3.1.4 修改 npm 源
默认的安装源在国外,下载不稳定,可以调整到淘宝源。
1 | # 配置 |
3.2 更新 hexo 相关包
首先通过npm install -g hexo-cli
安装hexo-cli
。
然后由于个人主页的许多配置都是两年前的,已经非常落后了,为此,对 npm 包进行升级。
全局升级
hexo-cli
,先hexo version
查看当前版本,然后npm i hexo-cli -g
,再次hexo version
查看是否升级成功。截至2020/10/12
,hexo
最新版本为5.2.0
。使用
npm install -g npm-check
和npm-check
,检查系统中的插件是否有升级的,可以看到自己前面都安装了那些插件。使用
npm install -g npm-upgrade
和npm-upgrade
,升级系统中的插件。使用
npm update -g
和npm update --save
。
3.3 hexo-asset-image 插件 bug 修改
hexo-asset-image
插件的作用是将 md 文件中的图片路径在生成个人主页是动态转换为对应网址路径,然而对应的 npm 包存在 bug,会导致路径生成出现错误。该 bug 作者在 github 中已经修改,但是没有发布新的 npm 包,所以需要手动修复文件。对应的修改操作为该commit。文件位置在./node_modules/hexo-asset-image/index.js
。
目前 bug 已经被修复,新版插件已经不需要在修改对应源码。
1 | 24 - var endPos = link.lastIndexOf('.'); |
3.4 hexo-browsersync 问题小记
在某次重启电脑后执行hexo s
命令时发现hexo-browsersync
所需要的 3000 端口被占用,提示listen EACCES
。通过netstat
指令却找不到相关进程信息。在一顿搜索后发现是 hyper-V 对端口进行了保留,当要修改保留端口时提示进程被占用,重启电脑后发现保留端口自己修改了,不再冲突。查看和修改预保留端口命令如下,我差点就想重置 winsock 了。
1 | netsh interface ipv4 show excludedportrange protocol=tcp |
四、 hexo 主题修改
4.1 选择主题
在升级完 hexo 以后,无奈的发现主题适配存在问题,于是重新搜索主题(前端实属不精,就不自己献丑搞了),最后敲定了主题:Fan。
- 首先将主题 fork 到自己的仓库中,然后按照主题的 GitHub 页面进行相关配置。
该主题在修改已经贡献到主题。Hexo 5.0.0+
版本中存在侧边栏 toc 无法正确响应的 bug,经排查后发现是 hexo 本身的 toc 生成机制对跳转路径进行了转码,但文章生成时没有转码,导致函数无法正确识别 toc-link。在主题的sidebar.js
文件结尾添加如下代码将侧边栏的 toc-link 重新解码即可。
1 | /** |
4.2 修改目录结构
默认的 hexo 新文章都生成在_post 目录下,当文章数目变多时无法快速查找,为此将文章以年为单位进行归类。修改根目录下的_config.yml
文件。然后将现有文章进行分类归纳,命令行一键操作可参考博文——如何在 Hexo 中对文章 md 文件分类。
1 | new_post_name: :year/:title |
五、 网站推送
在一切配置完成以后,需要通过hexo-deployer-git
插件设置推送服务,从而做到自动推送更新个人主页。
安装插件。
1
2npm install hexo-cli -g
npm install hexo-deployer-git --save配置推送地址。其中 repo 栏的设置参数与第二章配置一致。
1
2
3
4
5
6
7# Deployment
## Docs: https://hexo.io/docs/one-command-deployment
deploy:
type: git
message:
repo: git@youdomain:/home/git/hexo.git
branch: mastergit 添加可信目录
新版 git 更新了可信域机制,需要将
.deploy_git
对应目录添加到安全目录里面才可以完成部署。1
git config --global --add safe.directory 'your-projrct-dir/.deploy_git'
执行
hexo clean && hexo g && hexo d
推送个人主页。此处需要将云服务器生成的密钥,导入到本地计算机中。