使用Hexo搭建我的博客otuki.top

    今天写一下我的博客站点的诞生过程,因为实在不能说是顺利,未免自己今后遇到类似问题忘记解决办法,现记录一下,如果能帮到其他朋友,就再好不过了。


博客框架的对比

    通过查阅大佬们对各大主流博客引擎的对比,基本锁定以下三款:

  • Hexo
  • Jekyll
  • WordPress

    下面就来对比一下Hexo、Jekyll、WordPress三款博客引擎的优缺点:

Hexo:

  • 优点:

    1. 免费,运行速度快,可以搭建在 Github 上或VPS上。
    2. 操作比较简单,命令少,易于记忆。
    3. 支持markdown,Hexo最终生成的是一个静态博客,这就意味着它拥有其他博客系统无法比拟的低负载与高速度的特性。
  • 缺点:

    1. 每次使用一台新电脑运行前,都要重新安装和配置编译环境,不适合随时随地愉快的写博客。
    2. 没有强大的后台和插件支持,学习成本较高,需要一些网页基础。

Jekyll:

  • 优点:

    1. 免费,运行速度快,可以搭建在 Github 上或VPS上。
    2. 支持markdown,github默认支持jekyll, 源文件如果放到github上,它会自动帮你生成静态网站。
    3. 相对hexo而言,可以直接在github网页版上编辑和发布博客,多PC间切换和同步非常方便。
  • 缺点:

    1. jekyll用的liquid语法对程序员不是很友好,尽管功能更强大。
    2. 没有强大的后台和插件支持,学习成本较高,需要一些网页基础。

WordPress

  • 优点:

    1. 安装简单方便,甚至很多VPS供应商都提供了Wordpress的一键式安装工具,用户连上传文件的步骤都省了。
    2. 功能强大,可扩展性高,丰富的插件使用起来更加方便。
    3. 其搭建的博客对seo搜索引擎友好,收录也快,排名靠前。
  • 缺点:

    1. 需要租用VPS,不能搭建在Github上。
    2. 迁移成本高,且插件装多了运行速度会变慢。
    3. 对于大型的门户网站,数据库、用户管理、内容的分类管理等方面的限制,还是会让Wordpress会有些力不从心。

 

    在经过激烈的思想斗争之后,我选择了Hexo作为我的博客引擎。


域名租用及设置DNS

    翻看秋水逸冰的推,找到了一个网站可以对比各大域名注册商的所有顶级域名价格:

https://zh-hans.tld-list.com/

    在兼顾便宜和逼格后,选择了porkbun里的*.top域名。

 

  1. 购买就不细说了,为了买域名我还专门注册了PayPal来付钱。
  2. 购买之后进入域名管理界面

域名管理

    找到 DNS RECORDS ,编辑

域名编辑


    这里插播一下DNS的知识:

  • A和AAAA记录

这些主机名指向IP地址,通常用于路由浏览器请求。A记录表示IPv4地址,AAAA表示IPv6。

  • MX记录

这些告诉电子邮件服务器将邮件发送到特定域的位置。

  • TXT记录

这些可用于保存任意信息。SPF记录是一种TXT记录。

  • CNAME记录

这些可用于创建另一个主机名的DNS别名,但具有不寻常的属性,应谨慎使用。

  • ALIAS - CNAME展平记录

它们与CNAME记录类似,但设计用于根(或APEX)域。

  • NS记录

这些将权威名称服务器分配给主机名。Porkbun会自动为您处理这些问题。

    TTL(Time-To-Live),就是一条域名解析记录在DNS服务器中的存留时间。当各地的DNS服务器接受到解析请求时,就会向域名指定的NS服务器(权威域名服务器)发出解析请求从而获得解析记录;在获得这个记录之后,记录会在DNS服务器(各地的缓存服务器,也叫递归域名服务器)中保存一段时间,这段时间内如果再接到这个域名的解析请求,DNS服务器将不再向NS服务器发出请求,而是直接返回刚才获得的记录;而这个记录在DNS服务器上保留的时间,就是TTL值。增大TTL值,以节约域名解析时间,给网站访问加速;减小TTL值,减少更换空间时的不可访问时间。我将TTL设为864000,也就是十天。


本地端的操作

Git安装与配置

    Git是什么?

    Git是目前世界上最先进的分布式版本控制系统(没有之一)。

    在https://www.git-scm.com/download/中下载对应的系统版本的Git安装好,使用

1
git --version

查看Git版本,若显示版本信息则说明安装成功。

Git版本

    安装好后,进行一些初始化的操作,打开Git Bash设置用户名和邮箱:

1
2
git config --global user.name "用户名"  
git config --global user.email "邮箱地址"

    为了本地连接远端的VPS不用输密码,设置SSH Key。在Git Bash内执行:

1
ssh-keygen -t rsa -b 4096 -C "邮箱"
  • SSH 为 Secure Shell 的缩写,是建立在应用层基础上的安全协议。提供两种级别的安全验证:

    1. 基于口令的安全验证
    2. 基于密匙的安全验证(ssh-keygen)
  •   -t  即指定密钥的类型,密钥的类型有两种,一种是RSA,一种是DSA

  •   -b  指定密钥长度。对于RSA密钥,最小要求768位,默认是2048位。而DSA密钥必须恰好是1024位(FIPS 186-2 标准的要求)。

  •   -C  表示要提供一个新注释,用于识别这个密钥,所以””里面不一定非要填邮箱,可以是任何内容,邮箱仅仅是识别用的key

    注意,在这个过程中,会询问你是否需要输入密码。输入密码之后,以后每次都要输入密码。请根据你的安全需要决定是否需要密码,如果不需要,直接回车。

    公钥路径:

1
~/.ssh/id_rsa.pub

Node.js安装与配置

    Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型,使其轻量又高效。Node.js 的包管理器 npm,是全球最大的开源库生态系统。

    在https://nodejs.org/en/download/中下载相应版本,安装

    之后进行环境配置,主要配置的是npm安装的全局模块所在的路径,以及缓存cache的路径。之所以要配置,是因为以后在执行类似:npm install express [-g] (后面的可选参数-g,g代表global全局安装的意思)的安装语句时,会将安装的模块安装到C:\Users\用户名\AppData\Roaming\npm路径中,占C盘空间。

    若希望将全模块所在路径和缓存路径放在node.js安装的文件夹中,则在安装的文件夹D:\nodejs下创建两个文件夹

1
2
node_global
node_cache

    创建完两个空文件夹之后,cmd输入:

1
2
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

    接下来设置环境变量。在【系统变量】下新建NODE_PATH输入

1
D:\nodejs\node_global\node_modules

    将【用户变量】下的【Path】中npm的条目修改为

1
D:\nodejs\node_global

    配置完后,安装个module测试下,就安装最常用的express模块:

1
npm install express -g

    安装完之后,第一行显示模块安装路径


Hexo安装与配置

    使用npm安装Hexo:

1
npm install -g hexo-cli

    安装完毕后,在适当的位置新建一个文件夹(以hexo为例),并在文件夹内打开终端执行:

1
2
hexo init
npm install

    Hexo文件目录如下:


服务器端的操作

    我的VPS现在安装的是Ubuntu最新的18.04LTS操作系统,感觉比刚开始安的CentOS6好用太多。上班时配交换机用的是SecureCRT,用习惯了,所以还是使用它来通过SSH连接VPS。

Git安装与配置

  • 执行安装:
1
apt-get install git

    完成后通过

1
git --version

    查看是否安装成功。

  • 创建git的用户,就命名为”git”吧:
1
adduser git

    根据提示设置密码并赋予sudo权限:

1
2
chmod 740 /etc/sudoers
vim /etc/sudoers

    找到以下内容:

1
2
# User privilege specification
root ALL=(ALL:ALL) ALL

    在下面添加一行:

1
git ALL=(ALL:ALL) ALL

    保存退出后,文件修改回权限:

1
chmod 440 /etc/sudoers
  • 关闭git用户的shell权限:
1
vim /etc/passwd

    将最后一行的

1
git:x:1001:1001:,,,:/home/git:/bin/bash

    修改为

1
git:x:1001:1001:,,,:/home/git:/usr/bin/git-shell

    在这之后,通过执行su git 可能会报错:

1
2
fatal: Interactive git shell is not enabled.
hint: ~/git-shell-commands should exist and have read and execute access.

    将目录/usr/share/doc/git/contrib/git-shell-commands拷贝到git用户下/home/git/
修改所有者

1
chown -R git.git git-shell-commands

    如果该目录下的help和list没有执行权,那么再给它加执行权

1
2
chmod +x /home/git/git-shell-commands/help
chmod +x /home/git/git-shell-commands/list

    su git测试下,应该能看见

1
Run ‘help’ for help, or ‘exit’ to leave. Available commands:list
  • 初始化Hexo:
1
2
3
4
cd /home/git		//切换到git用户目录
mkdir blog.git //创建git仓库文件夹,以blog.git为例
cd blog.git //进入仓库目录
git init --bare //使用--bare参数初始化为裸仓库,这样创建的仓库不包含工作区
  • 创建网站根目录:
1
2
cd /var/www/		//切换目录
mkdir blog //创建网站目录,以blog为例
  • 配置SSH
1
2
3
4
cd /home/git				//切换到git用户目录
mkdir .ssh //创建.ssh目录
cd .ssh
vim authorized_keys

    然后将本地的公钥(~/.ssh/id_rsa.pub)复制到authorized_keys文件里

  • 用户组管理

    执行:

1
2
ll /home/git/
ll /var/www/

    确保blog.git、.ssh、blog目录的用户组权限为git:git

    若不是,执行下列命令修改权限后再查看:

1
2
3
sudo chown git:git -R /var/www/blog
sudo chown git:git -R /home/git/blog.git
sudo chown git:git -R /home/git/.ssh

Nginx安装与配置

  • 执行安装:
1
apt-get install nginx

    输入

1
nginx -V

    检查是否安装成功

  • 参考配置
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
server {
listen 80 default; //默认监听80端口
root /var/www/blog; //网站根目录
server_name leihungjyu.com www.leihungjyu.com; //网址
access_log /var/log/nginx/blog_access.log;
error_log /var/log/nginx/blog_error.log;
error_page 404 = /404.html;

location ~* ^.+\.(ico|gif|jpg|jpeg|png)$ {
root /var/www/blog;
access_log off;
expires 1d;
}

location ~* ^.+\.(css|js|txt|xml|swf|wav)$ {
root /var/www/blog;
access_log off;
expires 10m;
}

location / {
root /var/www/blog;
if (-f $request_filename) {
rewrite ^/(.*)$ /$1 break;
}
}

location /nginx_status {
stub_status on;
access_log off;
}
}
  • 配置Git Hooks
1
2
cd /home/git/blog.git/hooks	//切换到hooks目录下
vim post-receive //创建文件

    复制下面的内容到post-receive文件中:

1
2
3
4
5
6
7
8
#!/bin/bash
GIT_REPO=/home/git/blog.git
TMP_GIT_CLONE=/tmp/blog
PUBLIC_WWW=/var/www/blog
rm -rf ${TMP_GIT_CLONE}
git clone $GIT_REPO $TMP_GIT_CLONE
rm -rf ${PUBLIC_WWW}/*
cp -rf ${TMP_GIT_CLONE}/* ${PUBLIC_WWW}

    修改文件权限

1
sudo chown git:git -R /home/git/blog.git/hooks/post-receive

    赋予可执行权限:

1
chmod +x post-receive

Hexo启动

启动前的准备

  • 连接Git服务器

~/.ssh/文件夹下新建config文件:

1
2
3
4
5
Host 别名
HostName 服务器IP
User git
Port 端口号
IdentityFile ~/.ssh/id_rsa
  • 配置Hexo

    打开本地博客根目录下的_config.yml文件,找到最后的deploy配置,修改为:

1
2
3
4
5
6
# Deployment
## Docs: https://hexo.io/docs/deployment.html
deploy:
type: git
repo: 别名:/home/git/blog.git
branch: master


第一篇文章:Hello World

新建文章:

1
hexo n "文章名" 或者 hexo new "文章名"

生成:

1
hexo g 或者 hexo generate

部署:

1
hexo d 或者 hexo deploy

清理缓存:

1
hexo clean

本地预览:

1
hexo s 或者 hexo server

完成后部署:
以下两个命令的作用是相同的

1
2
hexo g -d 或者 hexo generate --deploy
hexo d -g 或者 hexo deploy --generate

    至此,Hexo自带的hello-world文章就可以看到了。

但愿我的博文能对您有所帮助~