利用GitHub免费托管和自动化部署个人博客@慕课网原创_慕课网

涉及的功能

免费博客托管

支持评论功能

源代码不开源

GitHub服务

基础认知

最广为人知的代码托管平台
静态文件托管服务(gh-pages)

优势

免费服务器托管成本
无需管理维护服务器
内置集成自动化部署

静态托管

基于免费账号的步骤

个人/组织下新建username.github.io或者organization.github.io

需要时public权限 _{（付费账号可以基于private权限的仓库）}

新建:username.github.io

setting/pages/branch 下配置

10分钟左右生效

setting/pages/branch 下配置

其他名称的仓库托管后域名地址

自定义域名解决的问题

域名无法完全自定义:username.github.io
无法自定义多个站点:username.github.io/subfolder仓库子目录和subfolder仓库站点冲突

自定义域名

评论功能

开源的评论系统(推荐)
- giscusopen in new window、Walineopen in new window等
自己搭建部署
- 看需求可以基于开源的项目

源码保护

源代码放到private仓库中，打包后部署到public仓库下

同一仓库下的自动化部署

每当 push 到 main 分支时触发自动化部署，部署分支在gh-pages

# .github/workflows/deploy.yml
name: Build and Deploy

permissions:
  contents: write

on:
  # 每当 push 到 main 分支时触发部署
  push:
    branches: [main]

jobs:
  build-and-deploy:
    concurrency: ci-${{ github.ref }}
    runs-on: ubuntu-latest
    steps:
      - name: checkout
        uses: actions/checkout@v3

      - name: node switch
        uses: actions/setup-node@v3
        with:
          node-version: '18.x'
          registry-url: 'https://registry.npmjs.org'

      - name: Install and Build
        run: |
          npm install
          npm run docs:build

      - name: Deploy
        uses: JamesIves/github-pages-deploy-action@v4
        with:
          folder: dist
          clean-exclude: |
            CNAME

不同仓库的自动化部署

不想直接公开源代码

不同平台输出不同的内容(通过打包配置)

生成部署用的SSH KEY

输入自定义名称，避免覆盖默认的文件，影响GitHub原有的SSH授权。

比如：id_github_deploy_to_blog & id_github_deploy_to_blog.pub

ssh-keygen -t ed25519 -C "id_github_deploy_to_blog"

配置新生成的SSH KEY

每个private_key只能在单仓库中使用一次

私钥配置在当前仓库中(settings/secrets and variables/actions/secrets)

公钥配置在目的仓库中(settings/Deploy keys)

对应的自动化部署脚本参考

在当前仓库和目的仓库配置好密钥

对应的 ssh-key: ${{ secrets.BLOG_PRIVATE_KEY }} 要和仓库中定义的匹配

# .github/workflows/deploy_to_blog.yml
name: Build and Deploy

permissions:
  contents: write

on:
  # 每当 push 到 main 分支时触发部署
  push:
    branches: [main]

jobs:
  build-and-deploy:
    concurrency: ci-${{ github.ref }}
    runs-on: ubuntu-latest
    steps:
      - name: checkout
        uses: actions/checkout@v3

      - name: node switch
        uses: actions/setup-node@v3
        with:
          node-version: '18.x'
          registry-url: 'https://registry.npmjs.org'

      - name: Install and Build
        run: |
          npm install
          npm run docs:build

      - name: Deploy
        uses: JamesIves/github-pages-deploy-action@v4
        with:
          clean: true # 默认清除，可以不配置
          branch: gh-pages # 默认分支，可不配置
          repository-name: wxungang/blog # 提交的目的仓库
          ssh-key: ${{ secrets.BLOG_PRIVATE_KEY }} # 私钥配置在当前仓库中(settings/secrets and variables/actions/secrets),公钥配置在目的仓库中(settings/Deploy keys)
          folder: src/.vuepress/dist # 需要提交的目录文件
          clean-exclude: |
            CNAME

利用GitHub免费托管和自动化部署个人博客

涉及的功能

GitHub服务

基础认知

更多功能

优势

静态托管

个人/组织下新建username.github.io或者organization.github.io

setting/pages/branch 下配置

其他名称的仓库托管后域名地址

自定义域名解决的问题

更多问题

评论功能

源码保护

同一仓库下的自动化部署

不同仓库的自动化部署

生成部署用的SSH KEY

配置新生成的SSH KEY

对应的自动化部署脚本参考

参考