Hexo快速搭建靜態博客並實現遠程VPS自動部署

這篇文章將如何搭建hexo，以及如何經過git webhooks實現遠程vps的自動部署

這篇文章適合的條件：

1. 簡單的用於我的博客、公司博客展現，hexo的定位是靜態博客，要實現動態服務器的功能並不適合

2. 有本身私有的服務器、vps、域名

3. git倉庫，Github或國內的Coding.net

hexo本地部署

流程：先在本機搭建好hexo環境，push到git倉庫，再部署到服務器上。

第一步，安裝hexo命令行工具，這個工具在服務器端也須要執行安裝

npm install hexo-cli -g

第二部，生成一個本地hexo項目

# 建立blog目錄，並初始化hexo項目
hexo init blog
cd blog
# 安裝hexo依賴，hexo是基於nodejs開發的，npm是nodejs的包管理工具
npm install
# 啓動本地服務，打開localhost:4000測試是否成功
hexo server

第三部，新建一篇文章

hexo new "My First Post"
# 啓動本地服務，查看效果
hexo server

這樣，在/source/_posts目錄下就生成了了my-first-post.md這樣一個文件，.md是markdown文件的擴展名，咱們可使用本身喜歡的工具去編輯markdown，好比Sublime Text。

這裏推薦一個Sublime Text插件，給人家免費推廣了，OmniMarkupPreviewer。

提交到遠程倉庫

你得須要一個遠程倉庫託管代碼，可使用Github或國內的Coding.net，由於我有些項目屬於私有項目，Github開私有項目是須要收費的，因此我選擇的是國內的Coding.net，速度也比較理想。

先在coding上新建一個項目名爲hexo，並拷貝倉庫ssh地址（使用ssh須要配置ssh公鑰和私鑰，若是不會配能夠google或使用http地址）。

提示，若是須要經過webhooks實現服務器自動化部署，推薦使用ssh會更方便一些

而後在hexo目錄初始化本地倉庫並提交到coding

git init
git remote add origin git@git.coding.net:lianer/hexo-blog.git
git add .
git commit -m 'publish'
git push origin master

這時候coding上已經有我提交的代碼了。

服務器環境配置

登陸你本身的vps服務器，安裝好nodejs,git,nginx，我的服務器仍是推薦使用ubuntu，安裝這些工具很容易，具體百度或谷歌。

我在公司搭的hexo，公司服務器使用的是centos，git我是請運維同窗幫我安裝的，比較麻煩。

將代碼從遠程倉庫拉下來

一樣的服務器也須要配置ssh才能使用ssh地址，不然仍是使用http地址吧。

在這裏，我直接把項目放在root目錄下了。

mkdir hexo
git init
git remote add origin git@git.coding.net:lianer/hexo-blog.git
git pull origin master

安裝hexo模塊

cd ~/hexo
npm install hexo-cli -g
npm install

hexo靜態編譯

hexo g

這一步會在hexo目錄下生成一個public目錄，這裏面就是編譯後的靜態文件目錄，
其實這時候直接訪問裏面的html文件便可看到完整的效果了，只不過還須要一個服務來運行它。

配置nginx

進入nginx服務配置文件目錄，該目錄下應該已經有一個default.conf，不去管它，另外新建一個配置文件

cd /etc/nginx/conf.d/
vi hexo.conf

在hexo.conf中輸入如下內容並保存，注意細節，不要少分號。

server {
    listen          80;  # 監聽端口
    server_name     imlianer.com www.imlianer.com;  # 你的域名
    location / {
        root        ~/hexo;
        index        index.html;
    }
}

重載nginx，使配置生效。

nginx -s reload

而後就能夠經過 http://imlianer.com 訪問hexo了。

Git WebHooks 自動化部署

是否是以爲每次寫完文章還要登陸服務器去執行一次git pull很麻煩？

ok，git有不少鉤子，能夠在倉庫發生變化的時候觸發，相似js中的事件。
WebHooks就是在你本地執行git push的時候，
遠程倉庫(coding)會檢測到倉庫的變化，併發送一個請求到咱們配置好的WebHooks。

實現WebHooks自動化部署的推薦條件：

1. 服務器端配置ssh認證

2. 服務器端配置nodejs服務，接收Coding發來的請求

遠程倉庫配置WebHooks

Coding WebHooks 配置界面

這張圖的配置的意思是：當倉庫發生push的時候，會發送一個請求到http://imlianer.com/webhooks/...。

爲了服務端的簡易處理，這裏沒有使用token，而是將url地址當作token，123456就充當了token的角色。

到這，倉庫這邊的配置就完成了，接下來的問題就是服務器如何接收這個請求並從新部署hexo了。

服務器配置響應WebHooks的服務

我使用的是nodejs，其它語言也能夠。

在本地hexo目錄中新建一個webhooks.js文件，內容以下：

var http = require('http')
var exec = require('child_process').exec

http.createServer(function (req, res) {
    // 該路徑與WebHooks中的路徑部分須要徹底匹配，實現簡易的受權認證。
    if(req.url === '/webhooks/push/123456'){
        // 若是url匹配，表示認證經過，則執行 sh ./deploy.sh
        exec('sh ./deploy.sh')
    }
    res.end()
}).listen(4002)

這段代碼就能啓動一個nodejs服務，監聽4002端口。
當請求過來的url徹底匹配的時候，執行deploy.sh。

再新建一個文件deploy.sh處理部署相關腳本，內容以下：

git pull origin master
hexo g

將新增的webhooks.js與deploy.sh兩個文件push到服務器。

而後在服務器中啓動nodejs服務監聽webhooks

node ./webhooks.js

這樣，當你本地提交文章的時候，服務器就會自動部署啦。

若是你使用上面的命令運行nodejs服務，nodejs服務會在前臺運行，
可使用pm2使nodejs運行在後臺。