接上文：傳送門
在使用hugo + nginx搭建好博客后，文章可以通過ftp上傳到服務器，然后在服務器上再編譯成網頁，或者本地搭建的hugo環境，編譯好網頁再上傳到服務器，這樣做雖然也可以，但是很麻煩，如果每次都這么發布文章，肯定玩幾次就不想弄了。
使用webhook就能實現自動部署，其實原理很簡單。理想狀態就是我把我的myblog項目托管到github，然后每次我寫完文章直接push到github倉庫，webhook監聽到我的push，給我的服務器發送一個http請求，服務器收到請求后執行本地shell腳本，自動拉取最新的倉庫代碼，然后執行hugo編譯成網頁。這樣就實現自動部署啦!
項目代碼托管到github
在常用的本地機器上安裝git，myblog 目錄作為 git 倉庫，push 到 github 進行備份。由於 public 目錄下的靜態網頁完全可由其余文件自動生成，因此倉庫可以排除 public 目錄。
touch .gitignore && echo "/public" >> .gitignore
git add .
git commit -m "初次提交"
git branch -m main
git push -u origin main
服務器安裝node
使用node可以很簡單的啟動一個web服務
選擇node版本
node安裝依次執行以下命令：
cd ~
wget https://nodejs.org/dist/v14.17.3/node-v14.17.3-linux-x64.tar.xz
tar -xvf node-v14.17.3-linux-x64.tar.xz
cd node-v14.17.3-linux-x64/bin
ln -s /root/node-v14.17.3-linux-x64/bin/node /usr/bin/
ln -s /root/node-v14.17.3-linux-x64/bin/npm /usr/bin/
我是centos系統，直接安裝編譯好的二進制文件了，之前試過自己編譯，要等好久就放棄了
安裝完后可以執行以下命令檢查：
node -v
npm -v
正確輸出版本號即可
npm安裝成功后，再安裝一下pm2，安裝后管理進程十分好用
npm install pm2@latest -g
ln -s /root/node-v14.17.3-linux-x64/bin/pm2 /usr/bin/
執行命令查看是否安裝成功
pm2 -v
配置腳本
新建一個目錄webhook，腳本文件放在這里
編寫shell腳本
cd ~
mkdir webhook
cd webhook
touch hugo-deploy.sh
vi hugo-deloy.sh
按i進入編輯模式，我的腳本如下（我的倉庫就是myblog，然后hugo生成的靜態文件就在~/myblog/public下，也是我的網站根目錄。如果網站根目錄不在這里，hugo也可以指定生成的目錄，使用hugo -d /dir）
#!/bin/bash
cd ~/myblog
git pull origin main
hugo
echo "deploy success!"
exit 0
按下Esc鍵，並輸入:wq保存退出文件。
給文件添加可執行權限
chmod +x hugo-deploy.sh
Github配置SSH Key
GitHub配置SSH Key的目的是為了幫助我們在通過git拉取代碼時，不需要繁瑣的驗證用戶名密碼，如果需要驗證，我們的自動腳本就掛了。
首先檢查是否存在sshkey
cd ~/.ssh
ls
# 或者
ll
# 看是否存在 id_rsa 和 id_rsa.pub文件，如果存在，說明已經有SSH Key
如果沒有則執行如下命令，然后回車到底
ssh-keygen
最后獲取sshkey填入github配置中（點擊右上角頭像，settings，找到ssh點進去取個名字復制下即可。）
cat ~/.ssh/id_rsa.pub
最后檢查下服務器倉庫的.git文件夾config文件是否是ssh提交，如果不是可以改掉
cat ~/.git/config
輸出
[core]
repositoryformatversion = 0
filemode = true
bare = false
logallrefupdates = true
[remote "origin"]
url = https://github.com/K1ngram4/myblog.git
fetch = +refs/heads/*:refs/remotes/origin/*
這里url改為git@github.com:K1ngram4/myblog.git這個地址可以到倉庫下載代碼的地方選擇ssh復制。
最后執行命令查看是否鏈接成功
ssh -T git@github.com
編寫js腳本
先安裝一個第三方插件github-webhook-handler
npm install github-webhook-handler --save
然后在webhook目錄下創建一個github-webhook.js文件，寫入以下內容，就是監聽github的webhook請求
var http = require('http')
var createHandler = require('github-webhook-handler')
var exec = require('child_process').exec
var handler = createHandler({ path: '/webhook', secret: 'mysecret' })
http.createServer(function (req, res) {
handler(req, res, function (err) {
res.statusCode = 404
res.end('no such location')
})
}).listen(7777)
console.log("github Hook Server running at http://0.0.0.0:7777/webhook");
handler.on('error', function (err) {
console.error('Error:', err.message)
})
handler.on('push', function (event) {
console.log('Received a push event for %s to %s',
event.payload.repository.name,
event.payload.ref)
exec('sh ./hugo-deploy.sh', function (error, stdout, stderr) {
if(error) {
console.error('error:\n' + error);
return;
}
console.log('stdout:\n' + stdout);
console.log('stderr:\n' + stderr);
});
})
記住這個地址http://kingram.top:7777/webhook這就是webhook要發送過來的地址，下一步需要用到。
啟動腳本
node github-webhook.js
這樣啟動可以用來調試，如果調試沒問題后，這樣啟動
pm2 start github-webhook.js
pm2 startup
github配置webhook
打開托管倉庫github.com/K1ngram4/myblog點擊右上角Settings按鈕，選擇Webhooks，點擊右上角Add wehook
Payload URL 填服務器端創建好的http://kingram.top:7777/webhook
Content type選擇application/json
Secret填入mysecret
到此，所有配置就結束了，可以在本機上push到倉庫，服務器就會自動編譯網站了。(#.#)