关于个人Hexo博客的搭建历史

Entropy Tree Lv4
  2023-01-17 14:06:17 2023-01-17 14:06:17 创建   2023-04-01 07:55:52 2023-04-01 07:55:52 更新   3.2k 字  12 分钟  

仅以此文回顾过去搭建Hexo博客的历程

前言

在早期笔者一直是通过github pages服务来运行博客网站，从而省略了对域名解析、nginx反向代理以及SSL证书的申请与HTTPS服务的开启这些配置

于是后期，笔者租赁了一台纯净Ubutun20.04LTS系统的轻量应用服务器，从零开始基于命令行配置hexo博客以及HTTPS服务的开启

Hexo博客的搭建

本地环境搭建

Git环境

  1. 访问git官网Git - Downloads (git-scm.com) 或寻找镜像站清华大学开源软件镜像站 | git for windows 下载对应系统的版本

  2. 安装Git，除了安装路径可选择C盘或D盘，其它均可直接下一步

  3. 配置环境变量，在系统环境变量的Path变量下增加变量值

    参考变量值：D:\Program Files\Git\cmd

  4. win+r输入powershell打开查看git版本信息

    1
    git -v

    显示出了版本号，则说明git配置完成

Nodejs环境

  1. 访问nodejs官网Download | Node.js (nodejs.org) 下载对应系统的nodejs版本。（linux系统可直接使用命令行下载而不需要手动配置，使用其它方式则需要手动添加环境变量或者软链接）

  2. windows下载完nodejs后需要配置环境变量（注意不要使用中文路径和带有空格的路径，默认路径中的Program Files中的空格会导致命令无法识别）

    windows参考配置

    1. 执行下载的nodejs的msi文件，选择安装路径D:\nodejs

    2. 配置系统环境变量，在Path变量下添加 D:\nodejs\ （这一步nodejs可能会自动配置好）

    3. 应用配置，保存关闭。win+r输入powershell打开命令提示符，输入

      1
      2
      3
      4
      # 查看nodejs版本
      node -v
      # 查看包管理器npm的版本(npm是nodejs默认安装的包管理器)
      npm -v

      以上命令检测到两个版本号后说明配置完成

    4. 完成以上步骤后基本就能够使用nodejs来搭建hexo。后续为非必须步骤，如果使用过程中存在一些问题可参考以下步骤解决

    5. 如果npm下载失败或下载速度缓慢，可能是由于默认服务器在海外的缘故，可指定国内镜像源下载或配置npm的国内镜像源

      1
      2
      3
      4
      5
      6
      # 指定镜像源下载,下载时加上--registry的参数,每次下载需要指定
      npm install -g 包名 --registry=https://registry.npm.taobao.org
      # 设置镜像源,将npm的默认源更换为镜像源
      npm config set registry https://registry.npm.taobao.org
      # 检测镜像站是否可用
      npm config get registry

    6. 按以上步骤nodejs安装在了D盘，但下载的包仍在C盘，这里的配置是将包从C盘迁移到D盘以减少C盘的占用

      在nodejs的根目录下，创建两个文件夹命名为node_global和node_cache，在文件夹的属性——安全里更改所有组或用户的权限为完全控制（防止权限不足而无法下载的问题）

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      # 设置全局安装路径(路径根据实际情况填写)
      npm config set prefix "D:\nodejs\node_global"
      # 设置全局缓存路径(路径根据实际情况填写)
      npm config set cache "D:\nodejs\node_cache"
      # 以上命令会在C盘用户文件夹下产生一个.npmrc配置文件由于保存上面的配置信息

      # 添加系统环境变量,在Path变量下新增变量值,变量值就是全局安装路径,否则新安装的命令工具无法执行

      # 检测全局安装路径
      npm root -g
      # 查看配置信息
      npm config list

      以上配置完成后，之后下载的包都会放到node_global/node_modules下

  3. nodejs环境搭建完成

Hexo环境

  1. 在完成了搭建git和nodejs的环境的基础上，就能够快速使用Hexo

  2. 在powershell中执行以下命令

    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
    # 全局安装Hexo命令行工具
    npm install -g hexo-cli
    # 查看Hexo版本信息
    hexo version

    # 选择一个合适的文件夹作为Hexo框架的存放目录(这里假设使用一个demo的空文件夹)
    # 执行以下3条命令就搭建好了基本的框架
    hexo init demo
    cd demo
    npm install

    # 在本地运行Hexo
    hexo server # 或简写为hexo s

    # 一些常用的Hexo命令

    # 新建一篇文章(文章内包含了Hexo的一些格式信息)
    hexo new "first blog" # 会在_posts目录下生成一个markdown初始文件,标题为first blog

    # 新建一篇草稿(草稿不会在网站上展示)
    hexo new draft "my draft" # 会在_drafts目录下生成相应的初始文件

    # 新建导航页(导航页主要是展示文章分类、标签、作者简介、友情链接等信息)
    hexo new page --path about/me "About me" # 个人简介,这里是固定写法。默认情况下还需要修改配置文件才能生效

    # 生成静态文件(一般是在新建文章并完成写作后使用或者在修改了文章的内容后使用)
    hexo generate # 可简写为hexo g

    # 启动服务器(用于预览网页效果)
    hexo server # 可简写为hexo s

    # 部署网站(需要配置远程服务器地址,部署之前需要先生成静态文件)
    hexo deploy # 可简写为hexo d

    # 清除缓存文件(一般是更换Hexo主题未生效时使用)
    hexo clean

    更详细的介绍请移步官网Hexo

远程环境搭建

创建Git仓库

先安装openssh，之后就可以通过ssh客户端远程连接服务器而不需要在浏览器上操作

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
# 安装SSH服务端
sudo apt install openssh-server
# 查看SSH服务是否启动
ps -e | grep ssh

# 创建一个blog用户管理Hexo(默认的root用户权限过高,容易影响到系统)
adduser blog
# 给予blog用户权限
vim /etc/sudoers
# 找到User privilege specification这一段,在下面添加以下内容
blog    ALL=(ALL:ALL) ALL

# 切换到blog用户(密码可在网页服务器控制台那边重置密码获得)
su blog

# 安装git
sudo apt install git

# 进入根目录,在/var/repo目录下创建一个名为hexo_static的裸仓库
cd /
sudo mkdir /var/repo/
sudo chown -R $USER:$USER /var/repo/
sudo chmod -R 755 /var/repo/
cd /var/repo/
# 创建裸仓库
git init --bare hexo_static.git
# 裸仓库不同于普通仓库,裸仓库是专门的共享仓库,不会存储文件,只保存历史提交的版本信息
# 实际上裸仓库就相当于普通仓库中隐藏的.git文件夹

配置Nginx反向代理

安装Nginx及可能遇到的问题
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
# 安装nginx
sudo apt install nginx
# 查看版本信息,注意大小写
nginx -V
# 注意这一步如果没有看到with-http_ssl_module字样的参数信息(如果有就跳过后续步骤),则需要从源码编译安装(已经安装了也没有关系,停止服务后替换配置文件即可)
# 如果想卸载也可以执行以下命令
sudo apt --purge autoremove nginx

# Nginx 官网 https://nginx.org/en/download.html
# /usr/local/src目录通常用于存放用户手动编译程序的源码包
cd /usr/local/src/
# 这里使用wget下载nginx的源码包
# 如果已经安装并配置了nginx,又不想重新配置,使用nginx -v命令查看已安装的nginx版本并替换掉以下命令中的版本号
wget https://nginx.org/download/nginx-1.22.1.tar.gz
# 解压提取包并进入解压目录
tar -zxvf nginx-1.22.1.tar.gz
cd nginx-1.22.1
# 查看原有的nginx安装目录
which nginx
# 停止nginx的运行
nginx -s stop
# 查看原有nginx的配置参数,注意大小写
nginx -V
# 在原有参数的基础上附加--with-http_ssl_module的参数配置SSL模块(下面只给出了一部分参数,完整参数由nginx -V显示的参数拼接SSL模块的参数而成)
sudo ./configure --prefix=/usr/local/nginx --with-http_ssl_module

# 这一步可能会缺少一些库,使用以下命令下载到相关库后重新编译

# 缺少PCRE的相关库,如果不缺这个库就跳过
sudo apt install libpcre3 libpcre3-dev

# 缺少zlib的库,如果不缺这个库就跳过
# 访问zlib官网http://zlib.net/下载zlib,这里直接用wget下载到当前的src目录
wget http://zlib.net/zlib-1.2.13.tar.gz
./configure --prefix=/usr/local/zlib
make && make install

# 缺少openssl的相关库,如果不缺这个库就跳过
sudo apt install openssl libssl-dev

# 重新编译nginx
sudo make
# 如果没有安装过nginx或者已经卸载了nginx则执行以下2条命令覆盖安装后即可跳过后续步骤
sudo make install
# 配置软链接使得在任意目录下能通过nginx的名称直接运行nginx的命令
sudo ln -s /usr/local/nginx/sbin/nginx /usr/sbin/

# 替换原有nginx的文件
# 备份原有nginx安装目录下的文件(这里以安装文件位于/usr/sbin/目录下为例)
cp /usr/sbin/nginx /usr/sbin/nginx.bak
# 将编译好的nginx文件覆盖掉原有的nginx
cp ./objs/nginx /usr/sbin/
# 重新查看nginx参数信息
nginx -V
# 看到了--with-http_ssl_module的参数,SSL模块配置完成
配置Nginx托管文件目录
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
# 创建/var/www/hexo目录用于存放Hexo生成的静态文件,修改目录所有权
sudo mkdir -p /var/www/hexo
sudo chown -R $USER:$USER /var/www/hexo
sudo chmod -R 755 /var/www/hexo
# 修改/etc/nginx/sites-enabled/default,使nginx的root目录指向hexo目录
# 在server里面添加以下配置
root /var/www/hexo;
# 重启nginx服务
sudo systemctl restart nginx

# 配置git钩子,用于实现本地Hexo生成的静态文件推送到指定目录
vim /var/repo/hexo_static.git/hooks/post-receive
# 添加以下配置内容并保存退出
#!/bin/bash
git --work-tree=/var/www/hexo --git-dir=/var/repo/hexo_static.git checkout -f
# 给予可执行权限
chmod +x /var/repo/hexo_static.git/hooks/post-receive

SSH远程连接配置

在windows上搭建SSH客户端

  1. 使用powershell运行以下命令在用户文件夹的.ssh文件夹下生成密钥

    1
    ssh-keygen -t rsa

  2. 将生成的公钥id_rsa.pub中的内容拷贝到服务器的/home/blog/.ssh/authorized_keys文件上

    1
    2
    3
    4
    sudo mkdir .ssh
    cd .ssh
    sudo touch authorized_keys
    sudo vim .ssh/authorized_keys

Hexo部署到服务器

  1. 编辑hexo根目录中的config.yml文件，在deploy处配置参数

    1
    2
    3
    4
    5
    deploy:
      type: 'git'
      # server_ip为服务器的公网ip
      repo: blog@server_ip:/var/repo/hexo_static.git
      branch: master

  2. 执行以下命令部署Hexo

    1
    hexo deploy

  3. 查看服务器的/var/www/hexo目录，能够看到上传的静态文件

  4. 访问服务器IP地址查看页面，如果访问失败则检查服务器内部是否开放了80端口并去浏览器控制台查看服务器厂商提供的安全组规则或外部防火墙是否开放了80端口。确认都开放之后重新访问

域名解析配置

域名的购买很简单，到这里笔者已经提前购买好了一年期域名，重点就是配置域名解析。如果租赁域名的地方和租赁服务器的地方不是同一个地方，则域名解析需要在租赁域名的地方进行配置

参考配置

主机记录一般就是填www，记录类型为A，记录值为公网IP地址，其它的参数默认即可

之后就可以通过www.域名来访问页面，如果想直接通过一级域名访问，也可以再添加一条主机记录为@，记录类型为A，记录值为公网IP地址的解析

SSL证书申请

这里笔者找了一个能申请90天免费SSL证书的网站https://ourl.co/zerossl 。具体的操作参考SSL证书申请

HTTPS服务开启

Nginx配置SSL证书

1
2
3
4
5
6
# 将下载到windows上的证书文件上传至服务器
# 指定一个目录用于存放证书文件(目录可自行选择,以下仅供参考)
sudo mkdir -p /ssh/cert && cd /ssh/cert
# 使用远程文件传输上传文件至服务器
# 将证书文件信息合并
cat ca_bundle.crt >> certificate.crt

Nginx配置参考

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
server {
        listen 80;
        server_name example.com;
        rewrite ^/(.*) https://$server_name$request_uri? permanent;
}

server {
        listen   443   ssl;
        ssl_certificate /ssh/cert/certificate.crt;
        ssl_certificate_key /ssh/cert/private.key;
        server_name example.com; #填写域名

        # ssl验证相关配置
        ssl_session_timeout  5m;    #缓存有效期
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;    #加密算法
        ssl_protocols TLSv1 TLSv1.1 TLSv1.2;    #安全链接可选的加密协议
        ssl_prefer_server_ciphers on;   #使用服务器端的首选算法
        
        root /var/www/hexo; #Hexo项目目录

        # Add index.php to the list if you are using PHP
        index index.html index.htm index.nginx-debian.html;
        location / {
                # First attempt to serve request as file, then
                # as directory, then fall back to displaying a 404.
                try_files $uri $uri/ =404;
        }
}

至此HTTPS服务配置完成，在访问笔者的页面时可以看到https开头的URL

参考资料

Hexo官网

Hexo部署至服务器

SSL证书申请

在NGINX上安装SSL证书 - 零SSL和 (zerossl.com)

  • 标题: 关于个人Hexo博客的搭建历史
  • 作者: Entropy Tree
  • 创建于 : 2023-01-17 14:06:17
  • 更新于 : 2023-04-01 07:55:52
  • 链接: https://www.entropy-tree.top/2023/01/17/blog-by-https/
  • 版权声明: 本文章采用 CC BY-NC-SA 4.0 进行许可。
推荐阅读
使用certbot自动化管理免费ssl证书 使用certbot自动化管理免费ssl证书 git 大型项目管理 git 大型项目管理 SSH 隧道技术 SSH 隧道技术
推荐阅读
使用certbot自动化管理免费ssl证书 使用certbot自动化管理免费ssl证书 git 大型项目管理 git 大型项目管理
评论
目录
关于个人Hexo博客的搭建历史
  1. 前言
  2. Hexo博客的搭建
    1. 本地环境搭建
    2. 远程环境搭建
    3. SSH远程连接配置
    4. Hexo部署到服务器
    5. 域名解析配置
    6. SSL证书申请
    7. HTTPS服务开启
  3. 参考资料