利用Github Actions實現自動化部署

王振宇發表於2021-08-26
Github

在沒有自動化部署的情況話，前端需要部署程式碼的流程可能是這樣的：

1.yarn build:xxx build指定環境包

2.將打包檔案給運維或者後臺（前端有許可權可省略這一步）

3.將打包檔案放到伺服器指定目錄

亦或者是做了自動化指令碼，但是每次需要後臺人員手動執行指令碼

     可見每次都需要進行一定的溝通以及手動操作，解決這個問題，我們可以利用Github Actions實現自動化打包部署

      很多時候，我們希望在提交程式碼，合併分支等操作的時候，需要做一些其他的操作，比如抓取程式碼、執行測試、執行打包、登入遠端伺服器、將檔案上傳到伺服器等，而且這些操作很多時候都是類似的。基於使用者的這個需求，Github推出了actions功能。

       actions允許開發者將每個操作寫成獨立的指令碼，存放到程式碼倉庫，開發者可以將這些指令碼釋出，釋出後的指令碼可以被其他開發者引用。

       有了actions,開發者不用自己寫指令碼，直接引用其他人的aciton即可（如果可以滿足你的需求），然後整個持續整合的過程，就變成了多個actions的組合。

       當你需要查詢actions的時候，可以去Github Action市場搜尋，點選需要的action，會進入該action的頁面

點選右上角的Use latest version或者點選下拉選擇版本，會彈出使用方法，點選複製使用即可

      想要使用github action執行我們的指令碼，需要在專案的根目錄建立.github資料夾，在.github資料夾下建立workflow資料夾，在workflow資料夾下寫我們的配置檔案，配置檔案為YAML格式，檔案字尾名為.yml,workflow資料夾下可以有多個.yml檔案，github會自動執行所有.yml檔案。workflow檔案的配置可以檢視官方文件，下邊貼上我的配置

name: 指令碼名稱
# 觸發指令碼的條件，develop分支push程式碼的時候
on:
  push:
    branches:
      - develop
# 要執行的任務
jobs:
  # 任務名稱
  build:
    # runs-on 指定job任務執行所需要的虛擬機器環境（必填）
    runs-on: ubuntu-latest
    # 任務步驟
    steps:
      # 獲取原始碼
      - name: 遷出程式碼
        # 使用action庫  actions/checkout獲取原始碼
        uses: actions/checkout@master

      # 安裝node
      - name: 安裝node.js
        # 使用action庫 actions/setup-node 安裝node
        uses: actions/setup-node@v1
        with:
          node-version: 10.16.3

      # 安裝依賴
      - name: 安裝依賴
        run: npm install

      # 打包
      - name: 打包
        run: npm run build:xxx

      # 上傳打包檔案到遠端伺服器
      - name: 上傳檔案到遠端伺服器
        uses: zhenyuWang/Upload-File-Action@v1.0.1
        with:
          username: "登入遠端伺服器的使用者名稱"
          server: "遠端伺服器ip"
          port: "22"
          ssh_private_key: ${{ secrets.私鑰}}
          # 要上傳檔案所在目錄
          local_path: "./dist/*"
          # 遠端伺服器目標路徑
          target_path: "/usr/local/nginx/html/xxx"
複製程式碼

上述指令碼只需要cv到自己的檔案裡就好，需要注意的是私鑰配置，過程如下

1.生成SSH key

ssh-keygen -t rsa -b 4096 -C "$(git config user.email)" -f test -N ""
複製程式碼

會得到以下兩個檔案

test.pub  (public key)
test      (private key)
複製程式碼

2.配置私鑰

開啟github倉庫，點選settings

然後點選左側Secrets

然後點選右上角New repository secret

需要注意的是這裡的私鑰名稱就是配置檔案裡的私鑰名稱

3.配置公鑰

登入遠端伺服器，找到.ssh/authorized_keys檔案，把公鑰檔案裡的內容複製到該檔案中

至此，我們的自動化打包部署就完成了，快去試下吧！

相關文章