6

使用 Azure 静态 Web 应用服务免费部署 Hexo 博客 - 晓晨Master

 2 years ago
source link: https://www.cnblogs.com/stulzq/p/16505837.html
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
neoserver,ios ssh client

最近在折腾 Hexo 博客,试了一下 Azure 的静态 Web 应用服务,发现特别适合静态文档类型的网站,而且具有免费额度,支持绑定域名。本文只是以 Hexo 作为示例,其他类型的框架也是支持的。

image-20220722144900633

整个流程完全自动化,免费。并且访问具有不错的速度,演示:https://zhiqiang.li

二.环境准备

将会以标准的 Hexo 博客来作为演示,如果还不会使用 Hexo 博客,可以阅读我前面几篇文章。

668104-20220722151351718-317496710.png

三.Azure 静态 Web 应用

访问 https://portal.azure.com/ 登录 Azure,如果没有账户可以去注册一个。

找到静态 Web 应用服务。

image-20220722145327975

计划类型选择:免费

区域选择:East Asia(香港)

image-20220722145508741

部署详细信息可以直接选择 Github,然后选择对应的仓库,Azure 会自动在仓库里设置 Github Actions,本文为了演示就选择其他,在创建后手动配置。

在你的博客根目录下创建 .github/workflows目录,然后创建 github action 文件: static-web-app.yml

name: Azure Static Web Apps CI/CD

on:
  push:
    branches:
      - master

jobs:
  build_and_deploy_job:
    if: github.event_name == 'push'
    runs-on: ubuntu-latest
    name: Build and Deploy Job
    steps:
      - uses: actions/checkout@v2
        with:
          submodules: true
      - name: Build And Deploy
        id: builddeploy
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for GitHub integrations (i.e. PR comments)
          action: 'upload'
          app_location: '/'
          output_location: 'public'
          app_build_command: 'npm run deploy'

3.配置 SECRET

进入你的博客仓库 Settings => Security => Secrets => Actions

新建一个 Secret,名称 AZURE_STATIC_WEB_APPS_API_TOKEN

image-20220722150410184

令牌在 Azure 获取:

image-20220722150437087

现在 push 任意 commit 都会触发 Github Actions 部署你的博客

image-20220722150608212

可以访问 Azure 提供的 URL 来访问

image-20220722150645365

五.自定义域

访问 设置 => 自定义域,可以配置自己的域名

image-20220722150801878

关于免费额度如下

image-20220722150901863
目前学习.NET Core 最好的教程 .NET Core 官方教程 ASP.NET Core 官方教程
.NET Core 交流群:923036995  欢迎加群交流
如果您认为这篇文章还不错或者有所收获,您可以点击右下角的【推荐】支持,或请我喝杯咖啡【赞赏】,这将是我继续写作,分享的最大动力!

声明:原创博客请在转载时保留原文链接或者在文章开头加上本人博客地址,如发现错误,欢迎批评指正。凡是转载于本人的文章,不能设置打赏功能,如有特殊需求请与本人联系!

About Joyk


Aggregate valuable and interesting links.
Joyk means Joy of geeK