使用webhooks实现前端项目自动部署

---

title: ‘使用webhooks实现前端项目自动部署’
date: 2022-01-12 21:51:24
tags: 编程
categories: 搭建服务器
keywords: webhook 自动部署
description: 客户端提交到git后,服务器端自动部署前端代码.
top_img: https://gitee.com/xuzhipu/img/raw/master/202201130723489.jpg
cover: https://gitee.com/xuzhipu/img/raw/master/202201130723489.jpg

---

webhooks: 每次push 代码后，git服务器都会调用远程 HTTP URL 发送一个 POST 请求.

功能简介

webhooks 是git服务器(比如gitee)常见的回调功能, 常见的业务场景有, 开发人员提交代码到码云->码云通知服务器->服务器拉取代码.

举例说明:

你打豆豆 -> 豆豆告诉老师 -> 老师收拾你.   豆豆告诉老师就是webhooks.

注意:webhook只是通知功能, 服务器执行什么脚本完全取决于应用场景

功能需求

开发人员将代码提交至gitee后, 阿里云服务器自动拉取代码.

案例准备

1. gitee仓库
2. 阿里云linux服务器

相关工具

1. 宝塔运维面板
2. 宝塔webHook1.2
3. linux服务器端需要安装git

操作步骤

1.安装webhook

宝塔面板----软件商店

2.配置webhook

2.1添加hook

注意: 一定要修改shell脚本的两个内容

#!/bin/bash
echo ""
date --date='0 days ago' "+%Y-%m-%d %H:%M:%S"
echo "Start"
if [ ! -n "$1" ];
then 
          echo "param参数错误"
          echo "End"
          exit
fi
# [修改1] ↓ 把项目拉到哪个目录下(路径必须是已经存在的)
gitPath="/data/nginx/html/$1"
# [修改2] ↓ git网址(比如gitee的,也可以粘贴全地址, 不用"$1"占位符.
gitHttp="https://gitee.com/xuzhipu/$1.git"
echo "项目路径：$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
        git pull
        # 设置目录权限
        chown -R www:www $gitPath
        echo "End"
        exit
else
        echo "该项目路径不存在"
        echo "End"
        exit
fi

2.2复制webhook的URL和秘钥

3.进入gitee配置项目

3.1添加webhooks

3.2 配置url和密码

3.3 测试调用

3.3.1gitee

3.3.2宝塔webhook

4常见问题

4.1gitee调用url推送失败

​ 检查服务器端口是否放行.

4.2 gitee调用成功,但宝塔hook未成功拉取

​ 1.[宝塔hook] : 检查shell脚本是否正确. 着重检查 web路径填写,git网站填写.

​ 2.[gitee] : 检查您填写在gitee中填写的url的 param=aaa 得修改成你的git项目名称.