博客静态文件发布至Infinityfree

InfinityFree 是一家提供永久免费虚拟主机服务的国外平台(真免费么?进入该网站可以看到上下左右的广告)

由于访问 GitHub 时常抽风打不开,补充一个博客的镜像访问(与 GitHub Pages 同步发布)

通过 GitHub Actions 的工作流自动发布至 InfinityFree

同步发布工作原理

1、首先,当前的静态博客是通过 GitHub Actions工作流构建出静态网页文件然后发布至开启GitHub Pages公共仓库

2、只需在 GitHub Actions的工作流yml文件中添加上传至 Infinityfree FTP 路径的步骤即可

3、Infinityfree 的子域名关联一个FTP路径,访问该域名即可打开静态网站

准备工作

注册 InfinityFree 账户

  1. 注册链接:https://dash.infinityfree.com/register
  2. 填写邮箱和密码,点击 Sign UP ,然后查看邮件点击 Verify Email Address

创建子域名

image-20250609110601574

image-20250609110356720

image-20250609111047697

image-20250609111954384

image-20250609112231064

获取 FTP 凭据

从 InfinityFree 控制面板获取以下信息:

image-20250609112442507

  • FTP 主机名
  • FTP 用户名
  • FTP 密码
  • FTP 端口
  • FTP 路径
    • 如果是第一个创建的子域名,那么默认的 FTP 路径为 /htdocs/
    • 如果是第二个创建的子域名,那么默认的 FTP 路径为 /your-subdomains/htdocs/

GitHub仓库设置

在 GitHub 仓库中设置 Secrets

image-20250609113055138

将 FTP 凭据加密存储在 GitHub Secrets 中:

  1. 进入你的 GitHub 仓库 → SettingsSecrets and variablesActions
  2. 点击 New repository secret,添加以下 Secrets:
    • FTP_HOST:FTP 主机地址
    • FTP_USERNAME:FTP 用户名
    • FTP_PASSWORD:FTP 密码
    • FTP_PORT:FTP 端口(21
    • REMOTE_DIR:服务器目标路径(如 /htdocs//your-subdomains/htdocs/

创建 GitHub Acton 工作流yml

在项目根目录下创建 .github/workflows/hugo-build-deploy.yml 文件,内容如下

name: Hugo Build & GitHub Pages Deploy & FTP Deploy

on:
  push:
    branches: [ "main" ]  # 触发分支

jobs:
  deploy:
    runs-on: ubuntu-24.04
    concurrency:
      group: ${{ github.workflow }}-${{ github.ref }}  # 防止并发冲突

    steps:
      # 步骤1:检出代码
      - uses: actions/checkout@v4
        with:
          submodules: recursive  # 递归检出子模块(适用于Hugo主题)

      # 步骤2:安装Hugo
      - name: Setup Hugo
        uses: peaceiris/actions-hugo@v2
        with:
          hugo-version: '0.136.5'  # 与本地开发环境一致
          extended: true  # 使用extended版本(支持SCSS等)

      # 步骤3:构建静态站点
      - name: Build
        run: hugo --minify --cleanDestinationDir  # 生成public目录

      # 步骤4:验证构建结果
      - name: Verify Public Folder
        run: |
          ls -la ./public
          [ -f ./public/index.html ] || exit 1  # 确保首页存在

      # 步骤5:部署到GitHub Pages
      - name: Deploy to GitHub Pages
        uses: peaceiris/actions-gh-pages@v3
        with:
          personal_token: ${{ secrets.BLOG_PAT}} # 如果secret取了其他名称,将MY_PAT替换掉
          external_repository: kiraster/kiraster.github.io # 填写远程仓库,不一定是这个格式,按照自己的情况写 
          publish_dir: ./public  # 指定发布目录(Hugo默认输出目录)

      # 步骤6:FTP上传到InfinityFree
      - name: FTP Upload
        uses: SamKirkland/FTP-Deploy-Action@v4.3.4
        with:
          server: ${{ secrets.FTP_HOST }}
          username: ${{ secrets.FTP_USERNAME }}
          password: ${{ secrets.FTP_PASSWORD }}
          port: ${{ secrets.FTP_PORT }}
          local-dir: ./public/  # 直接使用本地生成的目录
          server-dir: ${{ secrets.REMOTE_DIR }}
          dry-run: false  # 实际执行上传
          # dangerous-clean-slate: true  # 首次部署启用(取消注释),完成首次部署后再将其注释

触发 Github Acton 工作流

Github Acton工作流触发条件为 push 至 main 分支后自动触发,我是在本地创建的 yml,所以只需git三板斧(add-commit-push)即可

最后

  • InfinityFree:It can take up to 72 hours for new domains to be accessible everywhere!
  • InfinityFree 的 FTP 上传速度不是很快且空间只有 5GB
  • 尝试过分成两个yml工作流文件执行,但是使用 actions/download-artifact@v4 始终不能找到 actions/upload-artifact@v4 构建的 Artifacts (不折腾这个了)
  • 在 GitHub Actions 中,工作流不会自动回滚已执行成功的操作;同时,如果工作流其中一个步骤没有执行成功会被标记状态为 Failure (会有 notifications 邮件提示)
  • 小小 Hugo 网站没有工作流回滚
  • 首次 FTP 上传到 InfinityFree,可能是由于静态文件过多耗时较久,完成首次部署后注释dangerous-clean-slate: true之后的 FTP Upload 为增量上传
  • Have a good time!