Github Action实现CICD(简易版)

前言

CI/CD(Continuous Integration and Continuous Delivery)即指持续集成与持续交付。它是一种软件开发流程和方法论,旨在通过自动化和频繁的代码集成、构建、测试和部署,实现快速、可靠的软件交付。实现的方式有很多比如gitlab、Jenkins、docker、k8s 。本文要手把手带大家实现最简单的方式Github Actions。本文部署的是React的项目,大致思路与是PR触发Github Actions,先安装项目依赖环境,再执行Build,最后使用Rcync同步打包后的文件到服务器指定路径中。

workflows文件创建

在项目根目录下创建./github/workflows/main.yml文件。并将下面的yml内容粘进去。on是监听触发事件,我这里使用的PR触发方式,你可以改成push指定分支触发。jobs是一系列的任务流,可以根据你的需求更改,因为的项目使用了pnpm维护,所以需要执行npm install -g pnpm,没有test程序则可以跳过。

yml 复制代码
name:
  FileMaster frontend 生产环境部署
# 监听 dev 分支上的 push 事件
# on:
#   push:
#     branches:
#       - dev
# 监听 main 分支上的 pull_request 事件
on:
  pull_request:
    types:
      - closed
# 分支合并后后执行一系列的任务
jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout code
        uses: actions/checkout@v2

      - name: Install node.js
        # 使用action库  actions/setup-node安装node
        uses: actions/setup-node@main
        with:
          node-version: lts/*

      - name: Install pnpm
        run: npm install -g pnpm

      - name: Install dependencies
        run: pnpm i

      # 暂时没有编写test程序,可跳过
      # - name: Test
      #   run: pnpm test

      - name: Build
        run: pnpm build

      - name: Deploy to server
        # 使用ssh-deploy@v2.2.5版本更加稳定
        uses: easingthemes/ssh-deploy@main
        env:
          # 私钥
          SSH_PRIVATE_KEY: ${{ secrets.PRIVATE_KEY }}
          # SCP参数
          ARGS: '-avzr --delete'
          # 源目录
          SOURCE: 'dist/'
          # 服务器ip
          REMOTE_HOST: ${{ secrets.REMOTE_TXHOST }}
          # 用户
          REMOTE_USER: 'user'
          # 目标地址
          TARGET: '/www/wwwroot/cd.mileschen.cn'

Deploy to server

Deploy to server这步是使用Rcync工具同步打包后的文件到服务器指定路径去。 相关的参数详细解释:

  • SSH_PRIVATE_KEY:SSH连接的私钥,这里使用secrets的方式传入
  • ARGS:是Rcync工具的参数
  • SOURCE:打包后的目录
  • REMOTE_HOST:服务器IP,这里使用secrets的方式传入
  • TARGET:上传到服务器存放的路径

SSH_PRIVATE_KEY

  1. 先在服务器执行ssh-keygen生成 ssh 公钥、私钥对。
  2. 查看公钥 cat ~/.ssh/id_rsa.pub 内容,将内容添加到云服务器的 ~/.ssh/authorized_keys 文件中,可以使用vim ~/.ssh/authorized_keys 编辑,然后将公钥粘贴进去。
  3. service sshd restart重启SSH服务器。
  4. 查看私钥 cat ~/.ssh/id_rsa 内容,设置到 github secrets 变量 PRIVATE_KEY 中。 一定要注意这里有个换行

REMOTE_HOST

服务器IP,注意这里没有换行

问题总结

rsync exited with code 127

看似是服务器或者git action容器没装rsync。其实不是。出现这种情是IP的问题,上面的IP的填写不要加空行。新建secret时秘钥要加空行,其他参数则不用加。

rsync exited with code 255

原因分析:git action的权限不够,无法ssh登录服务器;authorized_keys文件的作用是配置服务器允许哪些客户端使用密钥进行身份验证。每个公钥都需要在该文件中有相应的条目才能成功进行身份验证。

解决办法:大概率是服务生成秘钥后没有安装公钥,参考上一节的第二、三步,将生成的公钥写入到authorized_keys文件中。

rsync exited with code 23

原因分析:.user.ini文件无权删除,git action需要删除这个问题,但权限不够 解决办法:在服务器删除该文件或修改它的权限为777

成功CICD

Action完成没有出现错误,能够在服务器对应目录下找到同步文件。

总结

Github Actions还有很多有趣的用途等待你去探索,比如push实现灯打开、发送微信、拨打电话等究极操作。


如果对您有帮助,麻烦点赞收藏,让更多踩坑的人看见,有任何疑问和想法,欢迎在评论区与我交流。

相关推荐
OpenTiny社区几秒前
Coding Agent 到底是怎么工作的,它又为什么会在复杂代码库里失真?
前端·github·agent
奇奇怪怪的6 分钟前
Graph RAG:知识图谱增强检索
前端
默_笙16 分钟前
🌏 MCP 是 AI 界的 USB-C:一个协议让所有模型都能用上所有工具
前端·javascript
以和为贵29 分钟前
🔥前端也能搞懂流式输出:从 SSE 到打字机效果
前端·人工智能·架构
阿成学长_Cain1 小时前
Linux telinit 命令详解:运行级别切换|关机重启|系统维护一站式掌握
linux·运维·前端·网络
Patrick_Wilson1 小时前
最佳实践是有保质期的:从一次 CDN external 白屏事故说起
前端·性能优化·前端工程化
YHHLAI2 小时前
[特殊字符] Agent 智能体开发实战 · 第一课:Tool Use —— 让大模型自动干活
前端·人工智能
nuIl2 小时前
我把 5 个编码 Agent 塞进了一个 npm 包
前端·agent·claude
L-影2 小时前
FastAPI 静态文件:Web 页面的“固定展柜”与“加速引擎”
前端·fastapi
陪我去看海2 小时前
受够了 AI 写完代码留下一堆端口?我做了一个端口管理App!
前端·macos·vibecoding