Drone搭配Github实现项目自动构建部署

前言

你应该对 docker 有一定的了解，本文所讲的部署大流程如下：

flowchart TD 提交触发代码 --> Github触发Webhook Github触发Webhook--> Drone开始构建项目

由于 Webhook 的 Payload URL 需要外网能够访问，所以要么给局域网做穿透，要么使用带公网 IP 的云服务器

通用内容列表，根据实际替换该内容

drone.demo.com，公网可访问的 drone 域名
192.168.253.16，服务器局域网 IP
43.23.23.23，公网 IP

Github 准备

创建 OAuth App

打开 github，前往 Settings - Developer Settings（在左边菜单下面一点） - OAuth Apps，点击 New OAuth Apps 按钮

在表单中

Application name，可以设置为 drone，会在后面登录部署好的 drone 控制页面授权的时候显示
Homepage URL，这个会涉及到跳转的问题，应该设置为后面部署好的 drone 根目录，http://drone.demo.com
Application description，描述，也是在授权时会显示
Authorization callback URL，登录成功后调整授权的地址，http://drone.demo.com/login

提交后会出现 Client ID 和 Client secrets 的内容，Client ID 类似Ov23lxxxxxxxxxxXSdR4，可能不会主动生成 Client secrets，需要点击 Generate a new client secret 手动生成，类似d36d925ebff4xxxxxxxxxxxxxxxxd200faa5b0fd的字符串。

Client ID 离开后后面还能看到，生成的 Client secrets 离开后是看不到的，保存到安全的位置，后面待用。

创建 Webhook

这一步不需要手动创建，可以在后面的 drone 控制台中自动添加

部署 drone 服务

我们将使用 docker 来部署 drone 和 drone-runner

drone

拉取镜像

shell 复制代码

docker pull drone/drone

运行容器

shell 复制代码

docker run \
  --volume=/srv/drone:/data \
  --env=DRONE_GITHUB_CLIENT_ID=Ov23lxxxxxxxxxxXSdR4 \
  --env=DRONE_GITHUB_CLIENT_SECRET=d36d925ebff4xxxxxxxxxxxxxxxxd200faa5b0fd \
  --env=DRONE_RPC_SECRET=71c7bba29ee37649681be3ecaf07e423 \
  --env=DRONE_SERVER_HOST=192.168.253.16:603 \
  --env=DRONE_SERVER_PROTO=http \
  --env=DRONE_USER_CREATE=username:imzbf,admin:true \
  --publish=603:80 \
  --restart=always \
  --detach=true \
  --name=drone \
  drone/drone

DRONE_GITHUB_CLIENT_ID，就是上面创建 OAuth App 生成的 Client ID
DRONE_GITHUB_CLIENT_SECRET，上面生成的 Client secrets
DRONE_RPC_SECRET，共享密钥，它用于 Runner 与 Drone 之间的通信验证，只要后面创建 Runner 的配置一样就可以，也可以用下面的命令生成
shell 复制代码
```
openssl rand -hex 16
```
DRONE_SERVER_HOST，我们使用 docker 部署，通常会在局域网内暴露端口，而不在公网上暴露这个端口服务（云服务器的防火墙中设置开闭），这里我们使用 603 端口，这里填写
DRONE_SERVER_PROTO，协议，我们使用 http 做演示
DRONE_USER_CREATE，自动创建的用户，一定记得添加 admin，不然在部署的时候，会出现权限不足的情况。

runner

拉取镜像

shell 复制代码

docker pull drone/drone-runner-docker

运行容器

shell 复制代码

docker run --detach \
--volume=/var/run/docker.sock:/var/run/docker.sock \
--env=DRONE_RPC_PROTO=http \
--env=DRONE_RPC_HOST=192.168.253.16:603 \
--env=DRONE_RPC_SECRET=71c7bba29ee37649681be3ecaf07e423 \
--env=DRONE_RUNNER_CAPACITY=2 \
--env=DRONE_RUNNER_NAME=drone-runner \
--publish=604:3000 \
--restart=always \
--name=drone-runner \
drone/drone-runner-docker

DRONE_RPC_PROTO，同上面的 DRONE_SERVER_PROTO
DRONE_RPC_HOST，同上面的 DRONE_SERVER_HOST
DRONE_RPC_SECRET，同 DRONE_RPC_SECRET
DRONE_RUNNER_CAPACITY，限制同时执行的任务数

到此部署完成

公网配置

我们上面使用了域名，所以添加一下域名解析和 nginx 代理

解析域名

在云服务的控制台中找到你的域名，添加解析

主机名：drone.demo.com
记录类型：A 类型
记录值：43.23.23.23

nginx 配置

我们要将 drone.demo.com 访问 80 端口的请求转到 603 端口上

如果在服务器上安装 nginx

shell 复制代码

yum install -y nginx

设置开启启动

shell 复制代码

sudo systemctl enable nginx

立刻启动

shell 复制代码

sudo service nginx start

nginx 的配置文件在/etc/nginx下

shell 复制代码

cd /etc/nginx/

默认的 http 配置会包含conf.d下面的所有配置，所以直接在这下面添加一个子项即可

shell 复制代码

cd conf.d && touch http.conf && vim http.conf

输入下面的内容后保存

conf 复制代码

# drone
server {
  listen       80;
  server_name  drone.demo.com;
  location / {
    proxy_pass http://127.0.0.1:603;
    proxy_set_header Host $http_host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header X-Forwarded-Proto $scheme;
  }
}

至此可以访问 http://drone.demo.com 前往控制页面了

测试运行

登录后点击 SYNC 按钮，会自动将你仓库的所有项目同步过来。

点击一个需要自动部署的项目

然后激活它（会自动添加 webhook）

然后依葫芦画瓢，如果没有设置 admin，可能就看不到 Trusted 选项

编辑项目流水配置

默认使用项目中根目录的.drone.yml 文件配置，在上面的配置中也可以修改文件指向

下面使用一个前端项目演示（用一些基础脚手架创建的项目即可）

yml 复制代码

kind: pipeline
type: docker
name: admin-deploy

trigger:
  branch:
    # 我们约定只在main分支发出的hook时触发，也可以是tag之类的
    - main

steps:
  - name: build-dist
    image: node:20.11.1-slim
    volumes:
      - name: yarn-cache
        path: /usr/local/share/.cache/yarn/v6
        # 我们会在构建容器中使用到docker
      - name: docker-sock
        path: /var/run/docker.sock
      - name: docker-bin
        path: /usr/bin/docker
    commands:
      - yarn install --frozen-lockfile
      - yarn build
      - docker rm -f blog-admin || true
      - docker rmi blog-admin || true
      - docker build -t blog-admin .
      - docker run -d -p 606:80 --restart always --name blog-admin blog-admin

# 定义流水线挂载目录，用于共享数据
volumes:
  - name: yarn-cache
    host:
      path: /usr/local/share/.cache/yarn/v6
  - name: docker-sock
    host:
      path: /var/run/docker.sock
  - name: docker-bin
    host:
      path: /usr/bin/docker

这个配置会在服务器上构建本地镜像，然后直接使用本地镜像运行容器，不需要将镜像推送到其他的管理库中，这需要 drone 和待运行的项目在同一个服务器中。

提交到 github 的 main 分支后，drone 就会自动运行。

Drone搭配Github实现项目自动构建部署

前言

Github 准备

创建 OAuth App

创建 Webhook

部署 drone 服务

drone

runner

公网配置

解析域名

nginx 配置

测试运行

编辑项目流水配置

评论区

历史记录