當(dāng)我們在更新迭代 Node 項(xiàng)目的時候，我們需要做以下幾步：

這樣做固然沒錯，但是一旦項(xiàng)目更新迭代過快，就需要不斷的重復(fù)著上面的步驟，在各種 bash 面板中來回切換，很是麻煩。

這時候，Webhooks 閃亮登場！

對于 Webhooks， Github 給出的解釋是：

Webhooks allow you to build or set up integrations which subscribe to certain events on GitHub.com.

簡單來說，利用 Webhooks，我們就可以實(shí)現(xiàn)網(wǎng)站的自動部署，現(xiàn)在就來看看具體該怎么做

配置腳本

這段腳本內(nèi)容是我們需要服務(wù)器自動執(zhí)行的

# autoBuild.sh

#! /bin/bash
git reset --hard origin/master
git clean -f
git pull
npm start

注：這段腳本將會自動在服務(wù)器中執(zhí)行

編寫 js 文件執(zhí)行腳本

由于我使用的是 Github 作為代碼倉庫，所以在這里，我們使用 github-Webhooks-handler 這個庫來實(shí)現(xiàn)我們的腳本自動執(zhí)行工作

按照文檔，我們按照以下方式來編寫 js 文件：

// autoBuild.js
var http = require('http')
var spawn = require('child_process').spawn
var createHandler = require('github-Webhooks-handler')
var handler = createHandler({ path: '/pushCode', secret: '' }) // 在代碼倉庫的 Webhooks 選項(xiàng)處配置
http.createServer(function (req, res) {
 handler(req, res, function (err) {
 res.statusCode = 404;
 res.end('no such location')
 })
}).listen(7777)

handler.on('error', function (err) {
 console.error('Error:', err.message)
})

// 監(jiān)聽 push 事件
handler.on('push', function (event) {
 console.log('Received a push event for %s to %s',
 event.payload.repository.name,
 event.payload.ref)
 rumCommand('sh', ['./autoBuild.sh'], function( txt ) { // 執(zhí)行 autoBuild.sh 腳本文件
 console.log(txt)
 })
})

function rumCommand( cmd, args, callback ) {
 var child = spawn( cmd, args )
 var response = ''
 child.stdout.on('data', function( buffer ){ response += buffer.toString(); })
 child.stdout.on('end', function(){ callback( response ) })
}

在 app.js 中，我們將端口設(shè)置為 3001，在這里代碼就不放出來了，可以在文末的 Github 鏈接里找到本教程的全部示例代碼

Nginx 配置

由于我們的示例代碼是跑在 3001 端口的，執(zhí)行自動化部署的 js 文件則跑在 7777 端口，所以我們需要配置一下 Nginx 來啟用這兩個端口：

# 啟用 7777 端口
server {
 listen 7777;
 listen [::]:7777
 server_name huangxizhou.com; #在這里填上你自己的服務(wù)器 ip 地址或者域名
 
 root /var/www/html/auto-build;
}

# 啟用 3001 端口
server {
 listen 3001;
 listen [::]:3001
 server_name huangxizhou.com; #在這里填上你自己的服務(wù)器 ip 地址或者域名
 
 root /var/www/html/auto-build;
}

這樣一來，Nginx 就配置完畢了，接下來就是代碼倉庫的 Webhooks 配置

Webhooks 配置

首先，我們進(jìn)入你想實(shí)現(xiàn)自動化部署的倉庫，點(diǎn)擊 settings -> Webhooks 來配置

在右側(cè)，就是配置你的接口地址以及 Secret，對應(yīng)之前的 js 文件里面的 Secret，選擇 Content type 為 application/json

初始化項(xiàng)目

第一次部署項(xiàng)目，還是需要我們自己手動操作的。

首先提交代碼至代碼倉庫（這里是Github），然后進(jìn)入服務(wù)器執(zhí)行 git pull

這樣，我們就成功部署了我們 Node 實(shí)現(xiàn)自動部署的代碼了

讓我們修改代碼來試試效果怎么樣

git push 之后轉(zhuǎn)到服務(wù)器內(nèi)一看，完美，成功運(yùn)行

再看看 Github

已經(jīng)自動觸發(fā)了接口，Node 自動化部署成功

最后

此技術(shù)不僅僅局限于 Node

局限性也是有的，只能單項(xiàng)目自動化部署，且必須依賴代碼倉庫

本項(xiàng)目的源碼地址：https://github.com/HuangXiZhou/auto-build

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com