技术分享
首页
  • JavaScript

    • 构造函数和原型
    • Cookie和Session
    • Object.create(null)和{}
    • TypeScript配置
    • typescript入门到进阶
  • 框架

    • Vue-Router
    • React基础入门
  • 其它

    • Http协议
    • 跨域问题总结
  • 分析Promise实现
  • Axios源码分析
  • Webpack原理
  • vueRouter源码分析
  • Vue

    • Vite快速搭建Vue3+TypeScript项目
    • Cordova打包Vue项目的问题
    • Vue将汉字转为拼音,取出首字母
    • h5项目问题总结
  • JavaScript

    • new Function
  • 后端

    • Node.js中使用Crypto生成Token
    • Body-Parser处理多层对象的问题
  • 其它

    • 项目Demo汇总
    • Vuepress+Vercel搭建个人站点
    • 项目中能用到的
    • husky规范代码提交
  • Mongoose基础
  • Multer文件上传中间件的使用
  • JavaScript

    • 浅谈两数全等
    • JavaScript进制转换
    • 手写bind,apply,call和new
  • 算法

    • 数组去重和排序
    • 数组扁平化
    • 斐波那契数列
  • JavaScript 数据结构
  • 其它

    • webpack面试题
    • vite面试题
    • svg和canvas的优缺点
    • TypeScript面试题
    • Vue常见面试题
  • 计算机网络

    • 数据链路层
    • 网络层
  • Git的使用
  • Nginx的使用
  • CentOS7安装Nginx
  • 正则表达式
  • SEO搜索引擎优化
  • Serverless介绍
友链
GitHub (opens new window)

刘誉

总有人要赢,为什么不能是我
首页
  • JavaScript

    • 构造函数和原型
    • Cookie和Session
    • Object.create(null)和{}
    • TypeScript配置
    • typescript入门到进阶
  • 框架

    • Vue-Router
    • React基础入门
  • 其它

    • Http协议
    • 跨域问题总结
  • 分析Promise实现
  • Axios源码分析
  • Webpack原理
  • vueRouter源码分析
  • Vue

    • Vite快速搭建Vue3+TypeScript项目
    • Cordova打包Vue项目的问题
    • Vue将汉字转为拼音,取出首字母
    • h5项目问题总结
  • JavaScript

    • new Function
  • 后端

    • Node.js中使用Crypto生成Token
    • Body-Parser处理多层对象的问题
  • 其它

    • 项目Demo汇总
    • Vuepress+Vercel搭建个人站点
    • 项目中能用到的
    • husky规范代码提交
  • Mongoose基础
  • Multer文件上传中间件的使用
  • JavaScript

    • 浅谈两数全等
    • JavaScript进制转换
    • 手写bind,apply,call和new
  • 算法

    • 数组去重和排序
    • 数组扁平化
    • 斐波那契数列
  • JavaScript 数据结构
  • 其它

    • webpack面试题
    • vite面试题
    • svg和canvas的优缺点
    • TypeScript面试题
    • Vue常见面试题
  • 计算机网络

    • 数据链路层
    • 网络层
  • Git的使用
  • Nginx的使用
  • CentOS7安装Nginx
  • 正则表达式
  • SEO搜索引擎优化
  • Serverless介绍
友链
GitHub (opens new window)
  • Git的使用
  • SEO搜索引擎优化
  • 常用cmd和linux命令
  • 代码片段
  • Serverless
  • CentOS7安装Nginx
  • GitHub Actions 自动化部署
    • 创建最小权限用户
    • 创建 SSH-KEY
      • 修改 id_rsa.pub 名称
    • tar 命令
    • 编写 ci.yml
  • Nginx的使用
  • 正则表达式
  • vscode调试总结
  • 其它
coderly
2021-04-04

GitHub Actions 自动化部署

# GitHub Actions 自动化部署

参考:GitHub Actions 入门教程 (opens new window)
参考:触发工作流程的事件 (opens new window)
参考:创建个人访问令牌 (opens new window)

  • 持续集成,类似于 Travis CI
  • GitHub 只要发现 .github/workflows 目录里面有 .yml 文件,就会自动运行该文件。
  • 编写 .yml 文件,在工作流程中触发的事件中执行相应代码

# 创建最小权限用户

只想新建的用户仅对一个文件夹进行读写操作(不开放其它权限)
只需要创建一个最小权限的角色
并仅给其分配单个文件夹的权限
可以防止权限过高造成安全隐患

  • Xshell 连接服务器
  • su 命令用来切换用户角色
  • 切换到 root 用户角色:su root,可能需要输入密码
  • 创建用户:useradd [username], 以创建 au 角色为例(useradd au),此时创建的 au 用户 默认使用 au 用户组
  • 使用 setfacl 设置文件权限: setfacl -m u:[username]:rwx [dirname],例如:setfacl -m u:au:rwx /usr/web/html/blog(给 au 角色设置 blog 文件的读写执行权限)
  • 此时创建的用户仅有 /usr/web/html/blog 文件的读写执行权限

# 创建 SSH-KEY

  • 切换到 au 角色:su au,直接使用最小权限用户生成 SSH-KEY
  • 查看是否已经存在:ls -al ~/.ssh
  • 生成新的 ssh key:ssh-keygen -t rsa, 连续三次回车
  • 检测是否生成成功:ls -al ~/.ssh

# 修改 id_rsa.pub 名称

  • 通过 au 角色创建好 ssh-key 后,公钥和私钥一般在 /home/au/.ssh 目录下
  • 切换到 .ssh 目录:cd /home/au/.ssh
  • 名字改为 authorized_keys:cat id_rsa.pub >> authorized_keys
  • 删除 id_rsa.pub:rm id_rsa.pub

# tar 命令

  • 压缩: tar -czvf blog.tgz ./*
  • 解压:tar xzvf blog.tgz

# 编写 ci.yml

参考文章 (opens new window)
ssh-deploy (opens new window)

  1. KEY:上一步服务器新建的公钥id_rsa.pub,cat id_rsa.pub 之后复制全部内容
  2. HOST:服务器 ip
  3. PORT:ssh 的端口号,默认为 22
  4. SOURCE:npm run build 之后打包的文件路径,相对地址(我的是打包到 webView 文件夹)
  5. TARGET:服务器上需要上传到的文件路径,绝对地址(我的是上传到 /usr/web/html/blog 文件夹下)
  6. 登录 Github,找到你要添加 Actions 的代码仓库,依次填入上述信息
actions 设置图片
















 







 










name: Publish And Deploy Demo # 显示在 Github Actions 里面的名称

# 监听 master 分支的 push 事件,执行 jobs 里面的内容
on:
  push:
    branches:
      - master

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest # 运行环境,告诉它运行在什么环境
    steps:
      # 第一步:下载源码(CI/CD拉取代码到自己的本地)
      - name: Checkout
        uses: actions/checkout@master # 切换到 master 分支

      # 第二步:添加node环境,不可缺失
      - name: Setup Node.js environment
        uses: actions/setup-node@v2

      # 第三步:打包构建
      - name: Build
        run: npm install && npm run build

      # 第四步:部署到服务器
      - name: ssh deploy
        uses: easingthemes/ssh-deploy@v2.1.6
        env:
          SSH_PRIVATE_KEY: ${{ secrets.KEY }}
          REMOTE_HOST: ${{ secrets.HOST }}
          REMOTE_USER: ${{ secrets.USERNAME }}
          REMOTE_PORT: ${{ secrets.PORT }}
          SOURCE: 'webView/'
          TARGET: '/usr/web/html/blog'
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34

将代码推到 Github 仓库,就会触发自定义的 workflow
并将打包好的代码部署到服务器

actions 成功图片
#Git
上次更新: 2021/04/04, 12:53:43
CentOS7安装Nginx
Nginx的使用

← CentOS7安装Nginx Nginx的使用→

最近更新
01
代码片段
04-22
02
koa全家桶
03-29
03
mocks项目复盘
03-29
更多文章>
Theme by Vdoing | Copyright © 2021-2022 coderly | MIT License
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式