宝塔+gitee配置webhooks，并运行npm打包（∞详尽）

soWhat
2,682 阅读3分钟

本地静态项目部署到宝塔上，为了提高发布效率，服务器上设置了git进行代码拉取，然后执行npm run build进行部署，但是我想更加自动化，于是我在宝塔上配置了webhook服务，当gitee上发送代码推送动作，可以触发宝塔上预设好的脚本进行操作，于是便实现了本地 git push 后代码自动化发布

什么是webhook？

webhook就是一个钩子，当git接收到push或者pull或者任意事件的时候，就会用post的方式触发一个请求

gitee上的说明： image.png

先不管这里...

移步宝塔...

软件商店搜索"webhook", 找到该应用，并安装

image.png

安装完后点击右方【设置】，为了方便管理，可顺手点亮【首页显示】，这样可以在首页进行管理

image.png

【添加hook】

image.png

脚本可先空着，【提交】后再进行编辑，没别的原因，只是因为二次编辑的时候输入框会比较大😀

添加完后可以看到列表如下

image.png 按钮作用说明：

查看密钥 > 给gitee用
测试 > 测试输入的脚本
编辑 > 编辑脚本
日志 > 查看脚本日志
删除 > (额，这不用说了吧)

配置密钥， 【查看密钥】

image.png

hook脚本中使用$1接收param参数

🖱 把上图的红框内的链接复制

移步gitee

⌨ 粘贴上一步复制的url，密码可不设置（我也没搞懂怎么用，搞懂了回来补充），勾选想要触发webhook的事件后点击【添加】 image.png

创建完成后可点击【测试】，看能否提交请求，成功的话会返回{"code": 1}

image.png

回到宝塔，编写（copy）脚本：

image.png

贴入以下代码，修改对应的网站目录和gitee路径（假设您的宝塔上已经安装了node环境）

echo ""
# 输出当前时间
date --date='0 days ago' "+%Y-%m-%d %H:%M:%S"
echo "Start"
# 判断宝塔WebHook参数是否存在,需要用到param参数的话可以开启此判断，否则可注释
if [ ! -n "$1" ];
 then 
           echo "param参数错误"
           echo "End"
           exit
 fi
# git项目路径, $1为webhook请求链接param的值，也可写死，这样请求的param可以whatever
gitPath="/www/wwwroot/$1"
# git 网址, $1为webhook请求链接param的值，也可写死，这样请求的param可以whatever
gitHttp="https://gitee.com/xxx/$1.git"
 
echo "Web站点路径：$gitPath"
 
# 判断项目路径是否存在
if [ -d "$gitPath" ]; then
        cd $gitPath
        # 判断是否存在git目录
        if [ ! -d ".git" ]; then
                echo "在该目录下克隆 git"
                git clone $gitHttp gittemp
                mv gittemp/.git .
                rm -rf gittemp
        fi
        # 拉取最新的项目文件
        git reset --hard origin/master
        
        echo "开始拉取代码"
        #pull命令记得加sudo
        sudo git pull origin master
        echo "拉取完成"
        
        #按需开启npm 安装和部署命令
        #npm install
        #npm run build
        #echo "部署完成"
        # 设置目录权限
        sudo chown -R www:www $gitPath
        echo "End"
        exit
else
        echo "该项目路径不存在"
        echo "End"
        exit
fi

啰嗦补充：请求链接中的param参数用于脚本中使用$1进行获取，如果此钩子是用于多个项目的，可以通过不同的param来指定执行对应的目录（前提是网站目录名称与gitee的项目名称一致），否则可以写死路径，也就不需要管param传什么了

保存后可点击【测试】进行测试，点击【日志】可以查看执行结果，发生报错的话看日志对症下药

🔈 插播：

服务器上安装git的时候如果没有设置用户名和密码有可能能会导致代码拉取失败，可按以下步骤进行设置： （假设你宝塔上的项目已经有git了）

进入网站目录可打开终端，pull的时候记得切换到对应的目录：

image.png

git config --global user.name "用户名"
git config --global user.email "邮箱"
git config --global credential.helper store

//会生成.gitconfig 的文件，查看
cat ~/.gitconfig  //显示内容

[user]
        name = 输入的用户名
        email = 输入的邮箱
[credential]
        helper = store
// 假设你已经设置好origin并已拉取过代码
// 第一次pull会提示输入用户名密码
[root@iZ25mi9h7ayZ test]# git pull
Username for 'https://gitee.com': xxxx@xxxx.com
Password for 'https://xxxx@xxxx.com@gitee.com':输入正确密码（看不到输入内容）
//生成.git-credentials 隐藏文件
cat ~/.git-credentials
https://Username:Password@gitee.com
// 看到这个说明已经设置成功

vi ~/.git-credentials
//可加多个用户名密码

大功告成，本地修改一下代码，再提交，看看远程代码是否按预期进行更新吧~

avatar
文章
阅读
粉丝