如何将静态网页部署到 Azure 应用服务

如何将静态网页部署到 Azure 应用服务

Azure 静态 Web 应用程序非常适合托管简单的 html 页面,例如,当您想要在主站点上进行一些站点维​​护时,您将 Azure 流量管理器指向的“下行”页面。

Azure 静态 Web 应用的问题在于您无法将证书上传到其中,如果您使用免费证书,则在整整 6 个月后,证书将尝试续订并失败,因为 DNS 将自定义域指向您的主站点。下次您想要将流量管理器翻转到您的下行页面时,您将收到 SSL 错误。

Azure 静态 Web 应用的优点在于,您只需将其指向 github 或 azure git repo,它就会创建一个管道,在编辑时部署您的静态网站页面。只需单击几下即可完成所有操作,太棒了。

为了解决此 SSL 问题,我们正在尝试设置 Azure App Service,但遇到了问题。

没有用于静态网页的 Azure 应用服务,因此我们选择 PHP,因为它最接近。

创建 Azure Web 应用时,它允许您链接您的 devops git 存储库(见屏幕截图),但与静态 Web 应用不同,它不会创建管道或设置任何自动部署。不幸的是,它不会像 Azure 静态 Web 应用那样在您的存储库中创建 yaml 文件。

在此处输入图片描述

事实上,我们找不到任何从 git 部署到 Azure Web 应用程序的方法。唯一的选择似乎是通过 Azure CLI,这当然不是我们的 Web 设计师的选择,而且我们还没有设法让它在 Apple Silicon 上运行。一定有一个 CD 选项。

有任何想法吗?

当我们解决这个问题时,下一个问题将是设置自定义域并将我们从 sectigo 获得的证书转换为 Azure 所需的格式,然后安装它们。

答案1

嗯,看起来微软旗舰 Web 应用服务不支持其旗舰 Devops Git。它只适用于 GitHub,这很遗憾,因为我们组织的所有存储库都在 Devops Git 中,而我们甚至没有 GitHub 帐户。

因此,解决方案是断开 devops git 作为源存储库的连接,转而连接 github 存储库。然后奇迹发生了 - azure 提交了一个预先创建的 yaml 工作流文件,并且在一分钟内,管道就部署了单个 index.html 页面。

查看 yaml 文件,部署一组静态文件只需要 zip 和解压缩,但它需要安装 php 并运行 compose:

name: Build and deploy PHP app to Azure Web App - downsite-webapp-test

on:
push:
branches:
  - main
workflow_dispatch:

jobs:
build:
runs-on: ubuntu-latest

steps:
  - uses: actions/checkout@v2

  - name: Setup PHP
    uses: shivammathur/setup-php@v2
    with:
      php-version: '8.2'

  - name: Check if composer.json exists
    id: check_files
    uses: andstor/file-existence-action@v1
    with:
      files: 'composer.json'

  - name: Run composer install if composer.json exists
    if: steps.check_files.outputs.files_exists == 'true'
    run: composer validate --no-check-publish && composer install --prefer-dist --no-progress

  - name: Upload artifact for deployment job
    uses: actions/upload-artifact@v2
    with:
      name: php-app
      path: .

deploy:
runs-on: ubuntu-latest
needs: build
environment:
  name: 'Production'
  url: ${{ steps.deploy-to-webapp.outputs.webapp-url }}

steps:
  - name: Download artifact from build job
    uses: actions/download-artifact@v2
    with:
      name: php-app

  - name: 'Deploy to Azure Web App'
    uses: azure/webapps-deploy@v2
    id: deploy-to-webapp
    with:
      app-name: 'downsite-webapp-test'
      slot-name: 'Production'
      publish-profile: ${{ secrets.AZUREAPPSERVICE_PUBLISHPROFILE_0114941A0CAD430486665B90DE3ED3A2 }}
      package: .

相关内容