持续交付实践 - GitHub Actions 部署 Node 应用到云服务器

前往 韦世东的技术专栏 收获爬虫架构/爬虫逆向/存储引擎/消息队列/Python/Golang相关知识

GitHub Actions 是 Github 官方推出的 CICD 工具，我们可以借助 Actions 构建自动化的部署工作流，那些环境安装、配置、文件移动操作再也不需要我们自己手动操作了。

在使用 GitHub Actions 前，我以为需要自己在云服务器上安装运行环境依赖、以为需要在服务器上安装 Agent。在实践过一次之后，我感觉是真的香！

Actions 给我带来了极大的便利，以部署 Node 应用到云服务器为例：

• 不需要我在服务器上安装 Agent；
• 不需要我在服务器上安装 Node 环境；
• 不需要我手动登录服务器；
• 不需要我安装 Git 应用；

在这样的条件下，我的个人技术专栏 韦世东的技术专栏 顺利上线了。

我的个人技术专栏选用的是 Vuepress，对应的是 NodeJS。这是一个全静态的专栏，没有数据库、没有后端，我只需要专心编写 Markdown 文件，然后 build 到服务器上即可。如果没有 CICD 的话，手动操作是很麻烦的，我得自己编写一个带有 SSH SCP 功能的 Shell 脚本，每次编写完代码后执行一遍以将静态文件推送到服务器。

GitHub Actions 工作流程与准备事项

在开始 Actions 实践之前，请阅读 SSH 免密码/免用户名/免IP登录云服务器实践，因为后续介绍到 Actions 自动部署将会用到 SSH 免密码登录。

先来梳理一下 Actions 部署 Node 应用到云服务器的工作流程：

• 监听特定的操作，例如执行 push 推送到仓库；
• 监听到之后按照预设的流程执行环境安装命令、项目打包命令；
• 将打包后生成的文件目录推送到云服务器的指定路径；

我们要做的是开启 GitHub Actions，然后按照 GitHub Actions 的规范配置一份 yaml 文件，以文件的方式告知 Actions 执行工作流时各个阶段的操作，例如拉取什么样的镜像、使用什么版本的打包工具、推送到哪台服务器等，同时为 Actions 设定云服务器的免密登录。

打开一个自己的 GitHub 仓库（以我为例，也就是我存放专栏(Node)应用的仓库），选择选项卡中的 Actions 项：

然后在面板中选择 set up a workflow yourself -> 选项，选择后 GitHub 会为我们在当前仓库创建一个 /.github/workflow/mian.yml 文件，文件内容如下：

# This is a basic workflow to help you get started with Actions

name: CI

# Controls when the action will run. 
on:
  # Triggers the workflow on push or pull request events but only for the main branch
  push:
    branches: [ main ]
  pull_request:
    branches: [ main ]

  # Allows you to run this workflow manually from the Actions tab
  workflow_dispatch:

# A workflow run is made up of one or more jobs that can run sequentially or in parallel
jobs:
  # This workflow contains a single job called "build"
  build:
    # The type of runner that the job will run on
    runs-on: ubuntu-latest

    # Steps represent a sequence of tasks that will be executed as part of the job
    steps:
      # Checks-out your repository under $GITHUB_WORKSPACE, so your job can access it
      - uses: actions/checkout@v2

      # Runs a single command using the runners shell
      - name: Run a one-line script
        run: echo Hello, world!

      # Runs a set of commands using the runners shell
      - name: Run a multi-line script
        run: |
          echo Add other actions to build,
          echo test, and deploy your project.

这是默认的配置文件示例，大抵含义是监听 main 分支的 push 操作和 pull 请求，如果监听到对应的操作则触发下方拉取 ubuntu 镜像以及执行 echo Hello, world 命令的工作流程。

这次以 Node 应用为例，最终使用的配置文件并非这一份，但整体流程和配置结构是相似的。

将以下内容粘贴到这份配置文件中：

name: Vuepress CI
on:
  # 监听 PUSH 操作
  push:
    branches:
      # MAIN 分支，也可以改成其他分支
      - main
jobs:
  build:
    runs-on: Ubuntu-20.04
    steps:
    - uses: actions/checkout@v1
    - name: Install Node.js
      uses: actions/setup-node@v1
      with:
        node-version: '14.15.0'
    - name: INSTALL
      run: npm install
    - name: BUILD
      run: npm run build
    - name: DEPOLY
      uses: easingthemes/ssh-deploy@v2.1.5
      env:
          SSH_PRIVATE_KEY: ${{ secrets.VUEPRESS_SERVER_PRI_KEY }}  # 密钥
          ARGS: '-rltgoDzvO --delete'
          SOURCE: "public/ " # 将要复制到云服务器的静态文件夹
          REMOTE_HOST: "10.1.1.1" # 云服务器公网地址
          REMOTE_USER: "root" # 服务器用户名
          TARGET: "/root/zhuanlan/" # 打包后的文件夹将放在目录

前半段几乎不用改动，只需要按照实际需求修改 SOURCE、REMOTE_HOST、REMOTE_USER、TARGET 等项即可。这些都是云服务器相关的配置，指明了 Node 应用最终部署的路径。

这里要注意的是 SSH_PRIVATE_KEY，它的值其实是保存在 GitHub Secret 中的服务器密钥，这个密钥就是用来实现免密登录效果的。

修改完成后记得保存文件，这时候 Actions 还不能正常工作。按照 SSH 免密码/免用户名/免IP登录云服务器实践 中介绍的密钥生成方式使用 ssh-keygen -m PEM -t rsa -b 4096 命令在云服务器上生成密钥对。

为什么是 ssh-keygen -m PEM -t rsa -b 4096 呢？这是因为配置文件中 DEPLOY 环节指定使用的是 easingthemes/ssh-deploy@v2.1.5 部署组件，它的文档中推荐的正是这个命令。

生成密钥对之后，将公钥字符串拷贝到云服务器的 ~/.ssh/authroized_keys 文件中，并检查 sshd 服务配置文件中的 PubkeyAuthentication 项配置是否打开且值为 yes。然后将私钥字符串添加到 仓库 - Settings - Scretes，该 Scretes 的名称设定为配置文件中填写的 VUEPRESS_SERVER_PRI_KEY 。当然，使用其它名称也可以，只需要两处保持一致即可。这一步操作的目的是实现免密登录。

接着将公钥字符串添加到 Github - Settings - SSH and GPG keys 中。这一步的目的是让云服务器拥有拉取仓库代码的权限。

一切准备就绪后，在主分支提交一次 push 命令。在 Github 仓库中选择 Actions 面板，面板中就会展示当前仓库中的 Workflow 记录和执行状态：

至此（上面的图片中显示的是两次 push 触发的两次 Workflow，绿色勾代表操作成功，红色叉代表操作失败。截图与本次操作无关，仅作演示。），GitHub Actions 部署 Node 应用到云服务器的实践就完成了！

如果你想通过域名访问到刚才部署的静态文件，那么还需要使用 Nginx 进行反向代理，同时将域名解析指向这台服务器哦。