使用Github Actions实现自动部署

准备工作

我将这一整个流程分为三个部分吧（本地vscode连接Github推送到仓库\远程服务器配置Github Actions，测试推送到服务器上\本地vscode编译测试成功后，推送到Github仓库，触发Github Actions编译推送到远程服务器完成部署），理清思路，分步来讲比较合适。

---

1、本地vscode配置连接GIthub仓库

a.下载安装git
    * 首先要在本地机器安装Git，请从 [Git 官网](https://git-scm.com/downloads) 下载并安装它。
    * 具体安装细节在这里就不过多讲述，网上教程都讲的很详细，不过记得勾选自动添加path（环境变量），不然就得自行添加；
    * 安装后打开cmd命令提示符，执行git --version命令查看版本号。

b.新建Github仓库及本地仓库 
    * 在Github上新建一个仓库，例如repository_name；
    * 在本地计算机新建一个本地仓库，即本地文件夹，例如example，该本地文件夹同时是VS Code项目代码的存放位置。
c.配置用户名及邮箱
    * 在本地文件夹中，按住shift同时鼠标右单机，选择在终端中打开；
    * 执行 > git config --global user.name "user_name" 命令配置用户名； 
    * 执行 > git config --global user.email "user_name@user_mail.com" 命令配置邮箱；
d.生成SSH密钥并设置Github仓库Deploy key
    * 以管理员身份运行cmd，执行 > ssh-keygen -t rsa -C "user_name@user_mail.com" 命令生成SSH密钥,中途遇到需要输入东西的时候可以按回车键直接跳过，这样的话所有的设置都是默认设置；
    * 执行完成后在 **Windows：** `C:\Users\your_username\.ssh` ，生成的秘钥文件包括：
        * **私钥（id_rsa）：** * 该文件包含您的私钥，应妥善保管，不要与他人分享。
        * **公钥（id_rsa.pub）：** * 该文件包含您的公钥，可以与他人分享，以便他们可以连接到您的计算机。
    * 利用记事本等编辑器打开**公钥（id_rsa.pub）**文件并复制该字符串；
    * 打开GitHub上的repository_name仓库，选择setting进入SSH and GPG keys，右上角点击New SSH key，将刚刚复制的字符串粘贴进key框框，title框框随意填写（回头用到的时候可以再来查）。
e.用vscode打开配置好的本地文件夹，点击左侧的源代码管理，进行推送或拉取。
    * 进入到github建好的仓库，复制仓库地址；
    * 到vscode顶格状态栏粘贴仓库地址，就可以在vscode与github之间进行推送、拉取和同步的动作了。

2、远程服务器配置Github Actions，测试推送到服务器

这一步真的让我心力憔悴，动用了GPT、Gemini、Google等力量，最后终于折腾出来了。（ps：教程是有很多的，至于能不能用看个人）

a.配置远程服务器与Github actions
    * 使用 > ssh-keygen -t rsa -b 4096 -C git@github.com:xxx/xxx.git ,生成一对 SSH 密钥（公钥和私钥）。连续三次回车即可，生成的文件在~/.ssh中
    （命令：ssh-keygen -t ed25519 -C "your_email@example.com"说明：ED25519 是一种较新的算法，提供更好的安全性和性能，生成的密钥更短，且安全性更高。它是目前很多用户推荐的算法之一，尤其在资源受限的环境中表现出色。）
    * 更改文件权限（chmod 700 ~/.ssh）、(chmod 600 ~/.ssh/authorized_keys)。
    * 将公钥添加到远程服务器的 authorized_keys 文件中（cat id_rsa.pub >> authorized_keys）。
    * 将公钥添加到Github的SSH keys中，进入Github主页，点击头像，选择settings，选择SSH and GPG keys，添加New SSH key。
    * 将私钥添加到所在项目仓库的Actions中，进入项目仓库，选择settings，点击左侧的Secrets and variables，选择Actions，点击New repository secret，填写Name（简短好记优先），将复制好的私钥粘贴到Secret 中，最后添加。
    ** 注意 **
        以上为通用方法，几个步骤都是必须的。如果这样配置完成，发现无法使用，那么还有更进一步的坑需要填
    ** 注意 **
        * SSH配置文件改写（/etc/ssh/sshd_config），打开秘钥登录功能。
            - PermitRootLogin yes 
        * 重启SSH服务。（service sshd restart）。
        * 启动SSH代理服务。（eval "$(ssh-agent -s)"）。
        * 将您的 SSH 私钥添加到 SSH 代理中。（ssh-add ~/.ssh/id_rsa）。
        * 验证链接。（ssh -T git@github.com）。

b.创建 GitHub Actions 工作流文件。
    * 在Github项目根目录下创建一个名为 `.github/workflows/deploy-to-remote-server.yml` 的文件。
    * 在工作流文件中配置您的作业。
    
     
yml
name: Deploy to Remote Server

on:
 push:
  branches:
   - main

jobs:
 deploy:
  runs-on: ubuntu-latest

steps:
 - name: Checkout code
 uses: actions/checkout@v3

- name: Setup SSH key
 uses: webfactory/ssh-agent@v0.5.3
 with:
  ssh-private-key: $\{\{ secrets.步骤1中仓库的私钥name \}\}

- name: Connect to remote server
 run: ssh -o StrictHostKeyChecking=no user@example.com

- name: Deploy code
 run: |
  cd /path/to/project
  git pull origin main
  npm install
  npm run build
  pm2 restart project
    * 请注意，您需要将 `user@example.com` 替换为您自己的远程服务器用户名和主机名，并将 `/path/to/project` 替换为远程服务器上项目所在的位置。 您还需要将 `SSH_PRIVATE_KEY` 替换为您的 SSH 私钥。您可以通过转到您的 GitHub 仓库的“设置”页面，然后单击“秘密”选项卡来创建和管理您的秘密。
    * 以上为在Github的配置

3、vscode推送到Github仓库，再推送到服务器端完成部署

a. 在本地vscode修改完成后，通过源代码管理，点击提交和推送，稍等几分钟，到服务器端就可以看到部署好的网页了。
b. ** 以上内容为回忆内容，大体上可以走完一整遍流程，内容或多或少会有缺漏，后续遇到问题我会继续修改增加内容。下面会贴出对我帮助很大的两篇贴文教程，感谢众多网友的分享！ **

参考教程

https://lunawen.com/cicd/20200628-luna-tech-github-action-blog-autodeployment/
https://blog.csdn.net/weixin_43002433/article/details/130632644