用VUE写了个小项目,每次更新了都要在本地 build 好了后打包再上传到服务器上,再解压。
这就很麻烦,一开始想要的用 jenkins 来自动集成,但是操作起来很麻烦,且没必要。但是我注意到了 github 提供了一个 webhook 钩子,当 push 了代码后,github 会向指定的 Url 发起一个 POST 请求。
那么,我就想到了可以用 flask 来监听请求,当收到了 github 的 POST 请求,就执行 shell 脚本开始 build 并把 dist 目录里的代码复制到网站目录。
那么开始动手
因为代码在 github 是公开的,所以不需要配置私钥,如果是私有的,则需要配置一个私钥让 github 信任服务器。
将源码拷贝下来。
> cd /root/build_home > git clone https://github.com/jethroHuang/clock_h5.git 复制代码
有了项目目录,就编写脚本来编译吧。
/root/build_home/build_mirror.sh
#!/bin/bash cd /root/build_home/clock_h5 rm -rf dist git pull npm install npm run build if [[ ! -d "dist" ]]; then echo "build error" exit 1 fi rm -rf /www/wwwroot/mirror.jethro.fun/* cp -rf dist/* /www/wwwroot/mirror.jethro.fun/ echo "build success" 复制代码
有了编译的脚本,下一步就是监听 github 的钩子了。
/root/build_home/webhook/main.py
# coding: utf-8 from flask import request, Flask import queue import os import threading import time app = Flask(__name__) # build 事件队列 build_signal = queue.Queue() # 是否 build 中 runing = False @app.route('/push', methods=['POST', 'GET']) def push(): if request.method == 'GET': return 'OK' else: # 如果队列是空的,则添加一个事件,否则不添加,为了防止重复请求添加过多的事件导致一直 Build # 这样可使队列中始终只有一个事件,当 build 开始执行后,又会变空,此时才能添加。 # 就能实现执行中多次请求,最终都只会执行一次 build if build_signal.empty(): build_signal.put('request build') return 'OK' @app.route('/') def index(): if runing: return '<h1>运行中</h1>' else: return '<h1>空闲中</h1>' def buildThread(): # 循环监听 build 事件 global runing while True: # 如果事件队列不为空,则表示需要执行Build if not build_signal.empty(): item = build_signal.get() print(item) runing = True # 开始执行 build 脚本 os.system('/root/build_home/build_mirror.sh > /root/build_home/webhook/build.log') runing = False time.sleep(0.5) # 启动一个线程来循环事件队列 t1 = threading.Thread(target=buildThread) t1.start() if __name__ == "__main__": app.run(host="0.0.0.0", port='5060') 复制代码
启动 flask 项目
> nohup python3 /root/build_home/webhook/main.py > /root/build_home/webhook/myout.file 2>&1 & 复制代码
点击 Add webhook
输入登录密码
填写 flask 监听的 url,当 push 代码后 github 会向这个 url 发起 post 请求
到这里以及配置好了,接下来只需要 git push 以下代码,github 就会去请求我们的 flask 项目的 /push 路由,此时会运行打包的 shell 脚本,shell 脚本会在编译后将结果拷贝到网站目录。整个流程就完了,如果除了问题,去看日志就完事了。因为是乞丐版,所以就没有做编译状态的显示这些。