将静态博客迁移至Microsoft Azure托管的详细步骤和教程

本文详细介绍了如何将静态博客从Cloudflare迁移至Microsoft Azure，并利用Azure的免费静态网页托管服务以及香港CDN节点来提升国内访问速度。以下是迁移步骤和教程：

准备工作

在开始迁移之前，您需要准备以下材料：

  1. Azure学生账户：通过申请Github Education Benefit可以获得Azure学生账户，具体申请方法请参考官方指南。
  2. 耐心：迁移过程可能需要一些时间和耐心，确保您有足够的时间来处理可能出现的问题。

开始迁移

步骤一：创建Azure静态网页

  1. 打开Azure门户，并导航至静态网页服务。
  2. 点击“创建”按钮，开始创建新的静态网页。
  3. 在“项目详细信息”中选择“Azure for Students”订阅。
  4. 创建或选择一个资源组。
  5. 在“托管计划”中选择“免费: 适用于业余爱好或个人项目”计划。
  6. 在“部署详细信息”中，关联您的Github账户并选择您的博客仓库。
  7. 在“生成详细信息”中，选择适合您网站的预设。如果您使用的是Astro框架，请选择“Custom”预设。
  8. 在“部署授权策略”中选择“部署令牌”。
  9. 在“Azure Functions API 和暂存环境的区域”中选择一个暂存区域，推荐选择“East Asia”，因为该区域的节点位于香港，可以降低国内访问延迟。
  10. 点击“创建+查看”，等待创建过程完成。

步骤二：配置Github Actions

  1. 打开您的博客仓库，并进入.github/workflows文件夹。
  2. 找到名为azure-static-web-apps-xxxxxxx.yml的文件，并打开它。
  3. 复制文件中第26行的azure_static_web_apps_api_token值，备用。
  4. 修改该文件内容，替换为以下内容（确保缩进正确）：
name: Azure Static Web Apps CI/CD

on:
  push:
    branches:
      - master
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches:
      - master

jobs:
  build_and_deploy_job:
    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
    runs-on: ubuntu-latest
    name: Build and Deploy Job
    steps:
      - uses: actions/checkout@v3
        with:
          submodules: true
          lfs: false

      - name: 安装 pnpm
        uses: pnpm/action-setup@v2
        with:
          version: 8

      - name: 设置 Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '20'
          cache: 'pnpm'

      - name: 安装依赖
        run: pnpm install

      - name: 构建项目
        run: pnpm run build

      - name: 部署到 Azure Static Web Apps
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_XXXXX }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "dist"
          api_location: ""
          output_location: ""
          skip_app_build: true

  close_pull_request_job:
    if: github.event_name == 'pull_request' && github.event.action == 'closed'
    runs-on: ubuntu-latest
    name: Close Pull Request Job
    steps:
      - name: 关闭 Pull Request
        id: closepullrequest
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_XXXXX }}
          action: "close"
  1. 将第44行和第61行替换为您之前复制的azure_static_web_apps_api_token值。
  2. 保存文件，并等待Github Actions重新构建。

步骤三：修改域名解析

  1. 返回Azure门户，并进入您创建的静态网页的概述页面。
  2. 点击“添加自定义域”按钮。
  3. 点击“添加”按钮，选择TXT验证，并在您的域名DNS解析中添加TXT解析和Azure提供的内容。
  4. 等待验证通过（可能需要三到四个小时）。
  5. 验证通过后，在您的域名DNS解析中添加CNAME解析，指向Azure提供的二级域名。
  6. 访问您的域名，确认博客可以正常访问。

迁移至此完成。现在您的博客已经成功迁移至Microsoft Azure，并可以利用Azure的免费静态网页托管服务和香港CDN节点来提升访问速度。祝您使用愉快！

标签: none

评论已关闭