首页 在CentOS 7中通过Hugo+Caddy+Webhook自动部署网站到服务器
文章
取消

在CentOS 7中通过Hugo+Caddy+Webhook自动部署网站到服务器

发表于 2019/10/19
作者 Ryn
9 分钟读完

折腾完Nginx后继续折腾Caddy，下面是踩坑记录。

大致过程

本地安装Hugo制作静态网站，将静态网站推到Github仓库中，服务器上安装Caddy利用Github的Webhook抓取静态网站到服务器上实现自动部署。

搭建环境

  • 本地：MacOS
  • 服务器：CentOS 7

Hugo

本地安装Hugo并搭建网站

可以参考官网的指引：https://gohugo.io/getting-started/quick-start/

安装Hugo

1

brew install hugo

可能会出现 brew 升级，大概需要5分钟，不想升级的ctrl+c取消掉就行了。验证Hugo是否安装成功可以查一下 Hugo 版本。

1

hugo version

创建网站

先选择存放网站的路径后执行以下命令，把devwl.com换成你都网站名或自己喜欢的名字即可。

1

hugo new site devwl.com

进入创建好的网站目录

1

cd devwl.com

此时的目录结构应该是这样的

1
2
3
4
5
6
7
8

.
├── archetypes # 内容类型，在创建新内容时自动生成内容的配置
├── content # 网站内容，Markdown 文件
├── data
├── layouts # 网站模版，选择主题后会将主题中的 layouts 文件夹中的内容复制到此文件夹中
├── static # 包含 CSS、JavaScript、Fonts、media 等，决定网站的外观。选择主题后会将主题中的 ststic 文件夹中的内容复制到此文件夹中
├── themes # 存放主题文件
└── config.toml # 网站的配置文件

然后可以找个主题，我的博客的主题用的是LeaveIt。如果你想参考别人网站用到什么主题，可以在https://whatcms.org上输入他的网址即可查询。注意不同类型引擎的主题不通用，即用Hugo搭建的网站只能用Hugo的主题。

导入主题

1
2

cd themes
git clone https://github.com/Mogeko/LeaveIt.git

创建一个新页面

1

hugo new about.md

此时content文件夹下就多了一个about.md文件，打开文件就可以看到时间、文件名等信息已经自动生成了。

1
2
3
4
5

---
title: "About"
date: 2019-07-20
draft: true
---

两条---间的信息是文章的配置信息，有的信息是自动生成的 (如：title、date 等)，注意冒号后面要加一个空格，不然会报错。

配置config.toml

config.toml用于存放整个网站的配置信息。可以参考/devwl.com/themes/LeaveIt/exampleSite/config.toml，每项配置信息的作用请参照注释和调试结果查看，这里不一一介绍。

拷贝/devwl.com/themes/LeaveIt下layoutsstatic两个文件夹至devwl.com下，覆盖已有文件夹。

注意：网站中About按钮对应的页面文件about.md应放到/devwl.com/content下，其它的文章应放到/devwl.com/content/posts下。

生成网站

设置完config.toml后我们进入/devwl.com目录下执行以下命令

1

hugo server --buildDrafts -w

此时你就可以在 http://localhost:1313 访问到你的博客了

简单介绍一下两个参数：

*--buildDrafts: 生成被标记为 「草稿」 的文档

*-w: 监控更改，如果发生更改直接显示到博客上 (保存即可预览效果)

但此时只能在本地访问 (相当于预览博客，如果与期望值不符，可以随时更改)，在/devwl.com目录下执行命令

hugo

此时你的博客目录下会多出一个public文件夹来。这便是 Hugo 生成的静态网站。

配置Webhook

需要你本机安装 Git ，并在Github建一个公开库，并把public推到这个仓库中。教程见Github官方中文教程。

本地执行命令cd public进入到public文件夹中，然后执行

1
2
3
4
5
6

echo "# 你的仓库名" >> README.md
git init
git add README.md
git commit -m "first commit"
git remote add origin https://github.com/用户名/仓库名.git
git push -u origin master

也可以使用Github客户端简化操作。

建好仓库后，在仓库的Settings下左侧的Webhooks里，点Add webhook添加钩子。

  • Payload URL设置为你的博客根目录加/webhook，例如这里就是https://devwl.com/webhook
  • Content type 设置为 application/json
  • Secret即密码，自己设置
  • 事件可以只选择push event
  • 点击Add webhook按钮即可。

服务器配置

Caddy

这部分参考了https://www.howtoing.com/how-to-host-a-website-with-caddy-on-centos-7

安装Caddy

1

curl https://getcaddy.com | sudo bash -s personal http.git

查看安装路径

1

which caddy

创建用户和组

1

sudo adduser -r -d /var/www -s /sbin/nologin caddy

创建必要的目录并赋权

1
2
3
4
5
6
7

sudo mkdir /etc/caddy
sudo chown -R root:caddy /etc/caddy
sudo touch /etc/caddy/Caddyfile
sudo mkdir /etc/ssl/caddy
sudo chown -R caddy:root /etc/ssl/caddy
sudo mkdir /var/www
sudo chown caddy:caddy /var/www

安装systemd服务配置文件

我测试的 CentOS 6 下安装不了systemd。

1
2

sudo curl -s https://raw.githubusercontent.com/mholt/caddy/master/dist/init/linux-systemd/caddy.service -o /etc/systemd/system/caddy.service

打开caddy.service，修改里边的用户、群组和ReadWritePaths

1

sudo vi /etc/systemd/system/caddy.service

1
2
3
4
5
6
7
8
9

#原值
; User and group the process will run as.
User=www-data
Group=www-data

#修改为
; User and group the process will run as.
User=caddy
Group=caddy

CentOS 7在这里有个坑，参见Unknown lvalue ‘ReadWritePaths’ in section ‘Service’

1
2
3
4

#原值
ReadWritePaths=/etc/ssl/caddy
#修改为
ReadWriteDirectories=/etc/ssl/caddy

修改过caddy.service就需要重载

1
2
3
4
5
6
7
8
9
10
11
12
13

sudo systemctl daemon-reload


#开机自启
sudo systemctl enable caddy.service

#查看是否启动成功，这里因为没启动应该显示 Active: inactive (dead)
sudo systemctl status caddy

#启动命令，还没配置完这里先不启动
sudo systemctl start caddy
#重启命令
sudo systemctl restart caddy

配置 Caddyfile

1

sudo vi /etc/caddy/Caddyfile

git以下的是http.git自动部署用，可以先注释先测试网站效果。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23

devwl.com  {
    tls youremail@gmail.com #随便一个可用的邮箱，申请https证书用
    gzip #启用压缩，提升网页打开速度
    root /var/www/devwl.com #你的网站根目录，里边直接放html文件
    
    #自动部署用，可以先注释后面再测试
    git https://github.com/devwulin/devwl.com.git { #你的仓库地址
        path /var/www/devwl.com
        then hugo --destination=/var/www/devwl.com/public
        hook /webhook pd #webhook里的secret
        hook_type github
        clone_args --recursive
        pull_args --recurse-submodules
    }
}

# A记录的@和www是两个网站，把www重定向至@
# 要把其它域名指向这个网站也是一样的写法
www.devwl.com {
    tls youremail@gmail.com
    redir https://devwl.com
}

把你本地生成的public下所有文件上传至服务器网站根目录下，比如我上面用到的/var/www/devwl.com。

1
2

sudo systemctl start caddy
sudo systemctl status caddy

启动caddy服务查看状态，sudo systemctl status caddy。

如果启动失败，可以用journalctl -u caddy查看日志。

启动成功就可以用网页打开你的网站了。

测试自动部署，你本地push到github后会自动触发，也可以在github-webhook下的Recent Deliveries点Redeliver手工推送。

瞎折腾, 网站
hugo caddy webhook
本文由作者按照 CC BY 4.0 进行授权
文章内容