宝塔+Gitee:配置Webhooks实现自动代码更新和部署


前言

在现代软件开发过程中,持续集成和持续部署(CI/CD)是一个必不可少的实践。它可以帮助我们快速、可靠地将代码更新推送到生产环境,从而缩短开发周期并降低运维成本。

在本文中,我们将介绍如何在宝塔面板和Gitee上配置Webhooks,实现代码的自动更新和部署。通过这种方式,当您将代码推送到Gitee仓库时,宝塔面板将自动拉取代码并执行部署命令,从而完成整个发布过程。

一、准备工作

在开始之前,您需要确保已经具备以下条件:

  1. 一个宝塔面板服务器,并已正确安装并配置。
  2. 一个Gitee仓库,并已将代码提交至该仓库。
  3. 一个用于部署的命令,例如:npm run build && npm run start

二、配置宝塔面板Webhooks

  1. 登录宝塔面板,并选择您要配置Webhooks的网站。

  2. 在网站管理页面,点击“设置”选项卡。

  3. 在“设置”页面中,找到“Webhooks”部分。

  4. 单击“添加Webhook”按钮。

  5. 在“添加Webhook”窗口中,填写以下信息:

    • Webhook地址: 填写您Gitee仓库的Webhooks地址。您可以在Gitee仓库的“设置”页面中找到此地址。

    • 请求方式: 选择“POST”。

    • 请求头: 填写“Content-Type: application/json”。

    • 请求体: 填写以下JSON数据:

      {
        "ref": "refs/heads/master"
      }
      
    • 备注: 填写一个便于识别的备注,例如“Gitee Webhook”。

  6. 单击“保存”按钮,完成Webhooks的配置。

三、配置Gitee仓库Webhooks

  1. 登录Gitee,并选择您要配置Webhooks的仓库。

  2. 在仓库的“设置”页面中,点击“Webhooks”选项卡。

  3. 单击“添加Webhook”按钮。

  4. 在“添加Webhook”窗口中,填写以下信息:

    • Webhook地址: 填写您宝塔面板网站的URL,后面加上“/api/webhook”即可。
    • 请求方式: 选择“POST”。
    • 请求头: 填写“Content-Type: application/json”。
    • 触发条件: 选择“推送”。
    • 是否公开: 选择“是”。
  5. 单击“保存”按钮,完成Gitee仓库Webhooks的配置。

四、测试Webhooks

  1. 在Gitee仓库中,推送一个新的提交。
  2. 登录宝塔面板,并选择您要测试Webhooks的网站。
  3. 在网站管理页面,点击“日志”选项卡。
  4. 在“日志”页面中,您应该可以看到一条来自Gitee的Webhooks记录。
  5. 单击该记录,查看详细的Webhooks请求信息。

如果一切正常,您应该可以看到以下信息:

{
  "ref": "refs/heads/master"
}

五、执行部署命令

当Gitee仓库收到推送时,宝塔面板会自动执行您在Webhooks中配置的部署命令。您可以通过以下步骤查看部署命令的执行结果:

  1. 登录宝塔面板,并选择您要查看部署结果的网站。
  2. 在网站管理页面,点击“任务”选项卡。
  3. 在“任务”页面中,您应该可以看到一条名为“Webhooks部署”的任务。
  4. 单击该任务,查看详细的部署结果。

如果部署成功,您应该可以看到以下信息:

部署成功

结语

通过本文的介绍,您已经学会了如何在宝塔面板和Gitee上配置Webhooks,实现代码的自动更新和部署。希望本文能够帮助您提高开发效率,降低运维成本。