hexo+阿里云搭建博客网站

2020-09-19折腾时间:

  • 15:15~18:00
  • 20:45~22:15
  • 23:50~00:20

经过5个小时的折腾(含笔记整理),输入公网ip之后,终于可以打开自己的博客网站了。

一、本地安装Hexo环境

1、安装 git 环境

2、安装Node.js环境

3、安装 Hexo

安装 hexo:

1
npm install -g hexo-cli

新建文件夹blog,然后初始化项目:

1
2
3
cd blog
hexo init
npm install

初始化完成后,blog文件夹内包括如下内容:

在blog文件夹内安装插件:

1
2
npm install hexo-deployer-git --save
npm install hexo-server

在blog文件夹内,配置git提交的账号邮箱:

1
2
git config user.email "youremail@mail.com"
git config user.name "yourname"

4、在本地预览项目

输入如下命令,在浏览器预览项目:

1
2
3
4
5
6
7
$ hexo server
或者
$ hexo s

INFO Validating config
INFO Start processing
INFO Hexo is running at http://localhost:4000 . Press Ctrl+C to stop.

在浏览器输入 http://localhost:4000 ,就能看到 Hexo 的默认主题下的主页了:

至此我们就完成了在本地的配置工作。

二、域名注册、服务器购买

1、域名注册

2、购买阿里云服务器 ECS

进入阿里云主页 https://www.aliyun.com/,点击“云服务器ECS ”进行购买:

购买服务器ECS时,可以选择如下配置:

  • 地域:选择离经常访问你网站的用户近一些的地域
  • 内存:1G
  • 云盘:40G
  • 网络:专有网络
  • 公网IP:包含
  • 带宽:1Mbps

按照上面的配置,2020-09-19这天的价格如下:

  • 一年:700
  • 三年:1600

我选择了三年的。

3、域名备案

域名备案时,需要先准备一个ECS服务器,我们可以直接用上面购买的服务器。

备案时间较长,请耐心等待。

三、阿里云ECS配置

重置实例密码

由于 ECS 服务器对 root 用户没有设置初始密码,因此我们需要对 root 密码进行重置:

温馨提示:记得妥善保管自己的 root 用户密码哦。并且在搭建的过程中如遇到不可挽回的局面可以考虑重置 ECS 实例,相当于重装系统。操作如下:

设置安全组

阿里云的服务器默认不开放端口号,这样使得我们在网站部署完成之后仍然无法访问。

有一个基本原因是没有开启端口号,因此我们需要新建安全组并添加 80 端口,再将安全组添加到 ECS 实例中。具体操作如下。

在控制台的 ECS 实例中点击「网络与安全–>安全组–>创建安全组–>快速添加」。在访问规则的入方向添加如下几个端口(尤其是80端口):

然后回到 ECS 服务器实例,将刚刚配置的安全组加入到实例中:

备注:安全组的出方向不用配置,默认对外都是放行的。

四、服务器端配置

此步骤是博客搭建过程中最容易出错的地方,提出以下几点建议:

  • 为了避免出错,推荐直接复制粘贴命令行代码。
  • 分清是在本地计算机上操作,还是连接服务器在服务器上操作。
  • 分清在服务器上使用 Git 用户还是使用 root 用户进行操作。

本地通过 ssh 连接服务器

我用的是Mac电脑,推荐使用 Royal TSX 软件进行ssh连接。

参考链接:在Mac上使用Royal TSX,替代 xshell 和 item2、SecureCRT,可以 SSH 也能 FTP

(如果你用的是 Windows电脑,推荐使用Xshell软件进行ssh连接。)

安装 nginx

参考链接:centos8平台编译安装nginx1.18.0

我们使用 nginx 作为 web 服务器和反向代理工具。

(1)安装 nginx 依赖环境(安装期间有提示一律选 yes):

1
2
3
4
yum install gcc-c++
yum install -y pcre pcre-devel
yum install -y zlib zlib-devel
yum install -y openssl openssl-devel

(2)下载 nginx 安装包:

1
wget -c https://nginx.org/download/nginx-1.18.0.tar.gz

将安装包解压到 /usr/local 目录下:

1
tar -zxvf nginx-1.18.0.tar.gz -C /usr/local

(3)进入 /usr/local 目录,确认 nginx 解压到该目录下:

1
cd /usr/local

进入 nginx-1.18.0 目录,会发现该目录下有一个 configure 文件,执行该配置文件:

1
2
3
cd nginx-1.18.0/
ls
./configure --prefix=/usr/local/soft/nginx --with-http_stub_status_module --with-http_ssl_module

解释:

  • –prefix 指定安装路径

  • –with-http_stub_status_module 允许查看nginx状态的模块

  • –with-http_ssl_module 支持https的模块

编译并安装 nginx:

1
2
make
make install

(4)查找nginx安装目录:

1
2
$ whereis nginx
/usr/local/nginx

进入安装目录:

1
2
3
4
$ cd /usr/local/nginx
$ ls
# 有下面这几个文件
# conf html logs sbin

由于 nginx 默认通过 80 端口访问,而 Linux 默认情况下不会开发该端口号,因此需要开放 linux 的 80 端口供外部访问:

1
/sbin/iptables -I INPUT -p tcp --dport 80 -j ACCEPT

(9)进入 nginx安装目录的sbin 目录,启动 nginx:

1
2
3
cd /usr/local/nginx
cd sbin
./nginx

没有任何消息,代表启动成功。此时输入公网 IP 即可进入 nginx 的欢迎页面了:

备注:注意要保证 nginx 服务处于 运行状态 才可以访问博客网站。nginx 相关命令如下:(在 cd /usr/local/nginx/sbin 目录下执行)

1
2
3
4
5
6
7
8
9
10
cd /usr/local/nginx/sbin

# 停止 nginx 服务
./nginx -s stop

# 启动 nginx 服务
./nginx

# 重启 nginx 服务
./nginx -s reload

配置 nginx 服务器路由

(1)为 hexo 创建一个部署目录 /home/www/hexo

1
mkdir -p /home/www/hexo

(2)进入 /usr/local/nginx/conf 目录,并对 nginx.conf 配置文件进行相关配置:

1
2
3
cd /usr/local/nginx/conf
ls
vim nginx.conf

打开nginx.conf文件后,按 i 键由命令模式切换到编辑模式,修改三个地方:

  • 首先将最顶端的用户改为 root。
  • 其次,将 server_name 改为自己的域名。如果没有备案,可以先填写自己的公网 IP(在阿里云控制台的 ECS 实例中查看),访问时暂时用公网 IP 进行访问。
  • 最后,将location中的 root 项中的值改为 /home/www/hexo;。如果 server 中的端口号不是 80,则改为 80

修改结束之后,先按 Esc 由编辑模式切换到命令模式,再输入 :wq 命令保存并退出编辑器。

nginx.conf 修改前:

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
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
#user  nobody;
worker_processes 1;

#error_log logs/error.log;
#error_log logs/error.log notice;
#error_log logs/error.log info;

#pid logs/nginx.pid;


events {
worker_connections 1024;
}


http {
include mime.types;
default_type application/octet-stream;

#log_format main '$remote_addr - $remote_user [$time_local] "$request" '
# '$status $body_bytes_sent "$http_referer" '
# '"$http_user_agent" "$http_x_forwarded_for"';

#access_log logs/access.log main;

sendfile on;
#tcp_nopush on;

#keepalive_timeout 0;
keepalive_timeout 65;

#gzip on;

server {
listen 80;
server_name localhost;

#charset koi8-r;

#access_log logs/host.access.log main;

location / {
root html;
index index.html index.htm;
}

#error_page 404 /404.html;

# redirect server error pages to the static page /50x.html
#
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}

# proxy the PHP scripts to Apache listening on 127.0.0.1:80
#
#location ~ \.php$ {
# proxy_pass http://127.0.0.1;
#}

# pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
#
#location ~ \.php$ {
# root html;
# fastcgi_pass 127.0.0.1:9000;
# fastcgi_index index.php;
# fastcgi_param SCRIPT_FILENAME /scripts$fastcgi_script_name;
# include fastcgi_params;
#}

# deny access to .htaccess files, if Apache's document root
# concurs with nginx's one
#
#location ~ /\.ht {
# deny all;
#}
}


# another virtual host using mix of IP-, name-, and port-based configuration
#
#server {
# listen 8000;
# listen somename:8080;
# server_name somename alias another.alias;

# location / {
# root html;
# index index.html index.htm;
# }
#}


# HTTPS server
#
#server {
# listen 443 ssl;
# server_name localhost;

# ssl_certificate cert.pem;
# ssl_certificate_key cert.key;

# ssl_session_cache shared:SSL:1m;
# ssl_session_timeout 5m;

# ssl_ciphers HIGH:!aNULL:!MD5;
# ssl_prefer_server_ciphers on;

# location / {
# root html;
# index index.html index.htm;
# }
#}

}

修改后:

修改nginx后,重启nginx:

1
2
3
cd /usr/local/nginx/sbin
ls
./nginx -s reload

安装 node.js

安装 node.js的命令如下:

1
2
3
cd ~
curl -sL https://rpm.nodesource.com/setup_10.x | bash -
yum install -y nodejs

过查看版本号验证是否安装成功:

1
2
node -v
npm -v

效果如下:

在服务器端创建 Git 用户

为了使我们能够在本地向服务器实现自动部署,需要在服务器端另外新建一个 Git 用户。然后使用公钥连接成功之后,就可以方便地随时进行自动部署了。

执行如下命令,在阿里云安装git环境:(有提示时,选择 yes 即可)

1
yum install git

安装结束之后,通过查看版本号验证是否安装成功:

1
2
$ git --version
git version 2.18.4

创建 Git 用户:

1
adduser git

修改 Git 用户权限为 740:

1
chmod 740 /etc/sudoers

在配置文件中增加 Git 用户。首先打开文件:

1
vim /etc/sudoers

进入文件后,后按 i 键由命令模式切换到编辑模式。如下图所示,在 root 下添加一行 Git 信息:

修改结束后,先按 Esc 由编辑模式切换到命令模式,再输入:wq 命令保存并退出编辑器。

将 Git 用户的权限改回去:

1
chmod 400 /etc/sudoers

设置 Git 用户密码:

1
2
3
4
5
$ sudo passwd git
更改用户 git 的密码 。
新的 密码:
重新输入新的 密码:
passwd:所有的身份验证令牌已经成功更新。

以上我们就完成了 Git 用户的创建,接下来我们向 Git 用户添加公钥,就像配置 Github 那样。

给服务器端的 Git 用户配置 ssh 公钥

温馨提示:使用 ctrl + c 复制命令,然后在终端点击右键就可以直接粘贴上去了,避免手动输入的麻烦。

流程大致如下:

  • 先在本地的C:\Users\用户名.ssh目录生成公钥id_rsa.pub和私钥id_rsa
  • 然后使用 FTP 上传工具,将公钥文件id_rsa.pub上传到服务器端的 .ssh 文件夹;
  • 最后将公钥文件id_rsa.pub内容拷贝到 authorized_keys 文件中。

如果你之前配置过公钥到 Github、Gitlab 等仓库,那你直接使用之前的公钥即可。

另外,我们要注意在本地操作还是在服务器端操作;在服务器端的时候,是使用 root 用户还是使用 git 用户操作。

(1)在服务器端切换到 git 用户,在根目录下创建 .ssh文件夹:

1
2
3
su git
cd ~
mkdir .ssh

此时,命令行信息中的 # 变成了 $,且 root 变成了 git,表示我们切换成功。

(2)在本地生成生成公钥、私钥:(注意是在本地)

1
2
3
4
5
$ cd ~
$ cd .ssh
$ ssh-keygen
Generating public/private rsa key pair.
Enter file in which to save the key (/Users/smyhvae/.ssh/id_rsa):

上面的命令中,如果有询问,直接回车即可。结束之后,会在 C:\Users\用户名\.ssh 里生成两个文件:公钥文件 id_rsa.pub、私钥文件id_rsa

注意,.ssh 为隐藏文件夹,你可能需要显示隐藏文件夹之后才可以看到。

(3)在本地终端输入以下命令,为私钥设置权限:

1
2
chmod 700 ~/.ssh
chmod 600 ~/.ssh/id_rsa

(4)使用ftp工具,将本地的 id_rsa.pub 文件上传到服务器端的/home/git/.ssh目录下:

在使用ftp工具登录远程服务器时,登录项如下:

  • ip:公网ip。
  • 端口:22
  • 协议:sftp
  • 用户名:git
  • 密码:xx

注意,此时服务器端 .ssh 文件夹里还没有 authorized_keys 文件,只有 id_rsa.pub 这一个文件。

(5)回到 服务器端,以 Git 用户身份在 .ssh 文件夹内新建 authorized_keys 文件,并将公钥内容拷贝到该文件中:

1
2
3
cd ~/.ssh
cp id_rsa.pub authorized_keys
cat id_rsa.pub >> ~/.ssh/authorized_keys

修改文件权限:

1
2
chmod 600 ~/.ssh/authorized_keys
chmod 700 ~/.ssh

(6) 确保设置了正确的SELinux上下文:

1
restorecon -Rv ~/.ssh

现在我们来验证一下,在本地输入如下命令,是否能正常连接到远程服务器:(不用输入密码,就能直接连上)

1
ssh -v git@xxx.xxx.xxx.xxx(你的公网 IP)

如果显示欢迎界面,表示本地连接远程服务器的git用户时,连接成功:

但是我们一般不使用 Git 用户进行服务端操作,而是使用 root 用户。Git 用户只是作为自动部署特意新建的。

比如说,在本地输入如下命令,可以连接远程服务器的root用户:(需要输入密码)

1
ssh -v root@xxx.xxx.xxx.xxx(你的公网 IP)

在服务端配置 Git 仓库

(1)继续在服务器端使用 Git 用户 新建 post-receive 钩子文件:

1
2
3
4
5
6
7
8
9
su git
cd ~
sudo git init --bare hexo.git

# 新建文件
touch ~/hexo.git/hooks/post-receive

# 修改文件权限
chmod +x ~/hexo.git/hooks/post-receive

备注:注意ls、touch、cat、vi/vim的区别。

输入如下命令编辑文件:

1
vim ~/hexo.git/hooks/post-receive

进入文件后,后按 i 键由命令模式切换到编辑模式。输入以下命令:

1
git --work-tree=/home/www/hexo --git-dir=/home/git/hexo.git checkout -f

修改完成后,先按 Esc 由编辑模式切换到命令模式,再输入 :wq 命令保存并退出编辑器。

(2)在服务器端使用root用户,修改文件权限:

1
2
3
su root
cd ~
sudo chmod -R 777 /home/www/hexo

(3)重启 ECS 实例。

到此,我们就完成了服务端的配置。

五、hexo本地部署和发布

本地 Hexo 配置连接和域名

主要是修改 _config.yml 文件。进入本地计算机 blog 文件夹的根目录,找到 _config.yml 文件并打开。

(1)把 deploy 参数改成如下方式:(注意,xxx 的地方是填写你自己的公网 IP )

1
2
3
4
deploy:
type: git
repo: git@xxx.xxx.114.110:/home/git/hexo.git
branch: master

(2)URL 配置项需要改为自己的域名:(如果没有备案,则可以先填写公网 IP)

1
url: http://www.qianguyihao.com

Hexo 自动部署和发布

我们可以在本地新建一个 xxx.md 文件放在 blog\source\_posts 目录中。然后在本地的blog目录下,执行如下命令,就可以将文章发布到服务器端了:

方式1:

1
2
3
hexo clean
hexo generate
hexo deploy

方式2:

1
2
3
hexo cl
hexo g
hexo d

方式3:

1
hexo cl && hexo g && hexo d

此时,在浏览器中输入自己的公网 IP,你就可以打开你的博客网站了。惊不惊喜?意不意外?

备注:在浏览器中输入自己的公网 IP之后,如果网站打不开,请记得检查之前的步骤是否正确,尤其是检查一下 nginx 服务是否已经启动。

域名DNS解析

当我们的域名备案成功之后,我们就有能力使用域名登陆自己的博客了。在此之前,需要在阿里云 控制台-域名 中设置域名解析。

点击“解析”:

在DNS解析设置里同时添加两条指向公网ip的主机记录:一条@记录,一条www记录。如下:

此时,在浏览器输入www.qianguyihao.com或者qianguyihao.com,就可以打开我的博客网站了。它们都是基于http协议的,等同于http://www.qianguyihao.com

将网站域名支持https

在上面的步骤中,网站域名只支持了 http,还没有支持https。所以,当我输入https://www.qianguyihao.com时,网站是不打开的。

那要怎么让网站域名支持 https呢?我们可以为域名添加免费证书,添加证书后,网站将变成安全的 https。

整体流程如下:(图1)

整体流程如下:(图2)

具体配置步骤如下。

购买免费证书

在阿里云主页搜索 SSL证书,然后点击“立即购买”:

按照下图所 示的选项进行选择,可以看到证书是免费的:

img

按照步骤的流程点击之后,域名解析里会自动多出下面这一条解析:

下载证书

解析完成后,马上会收到两条短信:

短信1:

1
【阿里云】尊敬的smy****@163.com:您为域名www.qianguyihao.com购买的SSL证书已签发成功,现可前往 SSL证书控制台 下载并安装至Web服务器或一键部署到阿里云云产品,详情可参考https://c.tb.cn/I3.ZW3uZ,如需人工帮助请拨打95187-2。

短信2:

1
【阿里云】尊敬的smy****@163.com:您的云盾证书服务实例:cas-cn-xx 开通成功。请登录云盾证书服务控制台查看及管理。

备注:阿里云控制台网址:https://console.aliyun.com

由于我们的 web 服务器是 ngxin,因此下载时选择 nginx:

回复之后就可以下载证书了。由于我们的 web 服务器是 ngxin,因此下载时选择 nginx。

在服务器端安装证书

(1)按照上面的步骤下载完成后,会得到一个xxx.zip压缩包,将压缩包解压后,会看到两个文件:xxx.keyxxx.pem

(2)连接服务器,以 root 用户进入 nginx 配置页面:

1
cd /usr/local/nginx/

创建 cert 文件夹用来存放证书:

1
2
mkdir cert
ls

然后使用ftp工具将刚才的两个证书文件上传到 cert 文件夹。

修改 nginx 配置文件:

1
2
cd /usr/local/nginx/conf
vim nginx.conf

i 进入编辑模式,拉到最下方,开放 443 端口,并填写ssl证书的文件名:

修改结束后,先按 Esc 退出编辑模式,然后输入 :wq 保存并退出。

修改前:

# HTTPS server
#
#server {
#    listen       443 ssl;
#    server_name  localhost;

#    ssl_certificate      cert.pem;
#    ssl_certificate_key  cert.key;

#    ssl_session_cache    shared:SSL:1m;
#    ssl_session_timeout  5m;

#    ssl_ciphers  HIGH:!aNULL:!MD5;
#    ssl_prefer_server_ciphers  on;

#    location / {
#        root   html;
#        index  index.html index.htm;
#    }

修改后:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
server {
listen 443 ssl;
server_name www.qianguyihao.com;

ssl_certificate /usr/local/nginx/cert/xxx_www.qianguyihao.com.pem;
ssl_certificate_key /usr/local/nginx/cert/xxx_www.qianguyihao.com.key;

ssl_session_cache shared:SSL:1m;
ssl_session_timeout 5m;

ssl_ciphers HIGH:!aNULL:!MD5;
ssl_prefer_server_ciphers on;

location / {
root /home/www/hexo;
index index.html index.htm;
}
}

(3)修改nginx后,重启nginx:

1
2
3
cd /usr/local/nginx/sbin
ls
./nginx -s reload

http 访问时,自动重定向到 https

继续修改 nginx 文件,修改原有端口 80 的监听,加一行配置:

1
2
3
4
server {
listen 80;
return 301 https://www.qianguyihao.com;
}

修改之后,当用户使用 http 协议访问网站时,会自动进行 301 跳转,以 https 协议访问网站。

修改nginx后,重启nginx:

1
2
3
cd /usr/local/nginx/sbin
ls
./nginx -s reload

Hexo 主题自定义

我用的是hexo-theme-melody 主题,官方文档上有详细的配置指南。

遇到的问题

Console expects a writable stream instance

问题描述:执行hexo init时报错Console expects a writable stream instance

解决办法:是Node.js版本的问题,v8.xx的版本太低了,建议升级到V10.x.x以上(我升级到了V12.18.4版本)。

参考链接:hexo与github结合

ssh连接中断的问题

Mac 连接服务器保持ssh会话:https://mp.weixin.qq.com/s/ylMPjyVnmptcEq12Gi-Nzg

想要通过 xxx.com 和 www.xxx.com 都能正常访问,怎么做

问:想要通过 xxx.com 和 www.xxx.com 都能正常访问博客网站,应该怎么做?

解决办法如下:

需要在dns域名解析中,同时添加两条指向公网ip的主机记录:一条@记录,一条www记录。如下:

添加完这两条记录后,通过 xxx.comwww.xxx.com,都可以访问你的服务器。

在支持https的情况下,如果你只添加了www记录,那么,只能通过以下网址访问:

1
2
3
www.qianguyihao.com
https://www.qianguyihao.com
http://www.qianguyihao.com

如果继续添加了@记录,还可以通过一下网址访问:

1
2
3
https://qianguyihao.com
http://qianguyihao.com
qianguyihao.com

补充:为了达到上面这个目标,nginx配置中,server_name只需要设置www.qianguyihao.com即可,不需要设置www.qianguyihao.com qianguyihao.com。不要多此一举。

参考链接:

参考链接

提到了如何将md文件进行管理。

http://www.mflyyou.cn/2020/03/06/hexo-da-jian-ge-ren-bo-ke/#toc-heading-15

Author: 千古壹号
Link: https://www.qianguyihao.com/2020-09-19-hexo-aliyun-blog/
Copyright Notice: All articles in this blog are licensed under CC BY-NC-SA 4.0 unless stating additionally.