本文仅记录Hugo产生的页面如何使用git方式传送到云服务器、自动更新页面数据并通过Nginx展示的配置过程，本文主要参考知乎上《将 Hexo 搭建的博客站点从 GitHub Pages 迁移到腾讯云 VPS》一文。

预备条件

  1. 已经有一台云主机可供使用（以下以Ubuntu Server 20.04 LTS 64位为例， 直接使用"ubuntu"账号），安装好了git、nginx软件，开放了用于ssh、http、https的端口
  2. 本地也已经安装了git
  3. 本地安装了hugo，并且使用和定制化了喜欢的主题， 已经有能力使用hugo产生静态页面
  4. 本地有putty或终端可以使用ssh的方式连接云主机， 最好可以通过key的方式验证登录

本地和云主机的git连接

出于安全考虑，最好将ssh连接的缺省端口22修改为一个不常用的端口号（如>5000）

  1. 建立云端git库，需ssh登录到云端
1
2
3

> mkdir -p ~/Blog/blog.git
> cd ~/Blog/blog.git
> git init --bare
  1. 在本地由hugo new site site_dir产生 受git管理的目录内增加或改变git remote的设置并推送此目录到远端，如
1
2
3
4

> git remote remove origin
> git remote add origin ssh://ubuntu@your_server:ssh_port/home/ubuntu/Blog/blog.git
> git remote -v ## 检查remote设置是否妥当
> git push --set-upstream origin master

Warning

有两点要注意，不然很容易踩坑

  • 使用key登录ssh时PuTTY使用的是ppk文件， 而git使用的是openSSH的id_rsa文件， 这两者可以使用PuTTYgen做转换，他们文件格式并不相同。
  • git remote的地址路径使用的是绝对路径， 若不小心仅使用了相对路径， 如ssh://ubuntu@your_server:ssh_port/Blog/blog.git 则因找不到目录而报没有权限读取的错误，此错误迷惑性很大。
  1. 在云端建立钩子程序以便每次收到推送时自动将最新数据提取到web目录
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19

> sudo mkdir -p /var/Blog/blog  ## 此目录是存放静态页面的目录
> sudo chown ubuntu:ubuntu -R /var/Blog/blog

> ## 创建钩子文件
> cd ~/Blog/blog.git/hooks
> vim post-receive
> ## 输入以下内容

echo "post-receive hook is running..."

GIT_REPO=/home/ubuntu/Blog/blog.git
TMP_GIT_CLONE=/tmp/Blog.blog
PUBLIC_WWW=/var/Blog/blog

rm -rf $TMP_GIT_CLONE
git clone $GIT_REPO $TMP_GIT_CLONE
rm -rf ${PUBLIC_WWW}/*
cp -rf ${TMP_GIT_CLONE}/public/* ${PUBLIC_WWW}/
rm -rf $TMP_GIT_CLONE
  1. 在云端配置Nginx

编辑/etc/nginx/nginx.conf，在http结构下增加一个简单的server定义如下

1
2
3
4
5
6
7

server {
    listen 80;
    server_name  your-server-domain-name; ## 例如 xxx.com
    root your-public-www-directory; ## 例如 /var/Blog/blog
    ## 自定义404页面
    error_page 404 /404.html;
}

重启Nginx并设开机启动

1
2

> sudo nginx -s reload
> sudo systemctl enable nginx