如何使用Python部署Azure静态Web应用程序

吴欣
260 阅读4分钟

现代静态网站（俗称JAMstack Apps）提供了一个定制的网络体验，几乎没有成本。 随着时间的推移，它已经发展了很多，但有一点是一致的。它是现代python!

output of my static site generator building files

很多人都使用github页面、Netlify或Vercel等工具，自从加入微软后，我想了解更多关于如何使用Python和Azure制作静态和动态网站。

我第一次了解到静态网络应用程序（SWA）是在我的第一周，当时团队正在庆祝该产品的一周年。根据设计，该计划是通过混合HTML和可选的动态内容，通过Azure函数为网络应用提供服务。

Python已经不再是构建静态网络应用的首选，但仍有可能部署一个静态网络应用。遗憾的是，你要做的事情比你要使用Javascript多一点。

设置Azure静态Web应用（VS代码方式）

你可以使用《[Azure静态网络应用程序入门》，用VS Code来设置Azure静态网络应用程序。这里提供了一些Web框架的选择，对你来说，最接近的是vanilla JS路线。我们将跳过前几步，因为我们没有使用演示 repo（或Javascript）。我不想重述教程，这里是一个快速回顾。

  1. 在VS Code中打开你项目的回购库
  2. 安装Azure扩展并登录你的Azure账户
  3. 选择 "资源"标签中的Azure侧栏菜单
  4. 选择创建图标（加号）。
  5. 在提示中，选择创建静态Web应用
  6. 通过向导运行
    1. 连接你的GitHub账户
    2. 为你的项目创建一个名称
    3. 选择你喜欢的地区

下一步是事情开始变得不同的地方。

  1. 重要的是，选择CUSTOM作为部署方法。
  2. 将你的应用程序位置设置为项目的"/"路径或你的Python代码所在的位置。
  3. 将输出路径设置为你的代码将创建HTML的位置。

让你的网站启动和运行

遗憾的是，Azure静态Web应用不支持轻松运行基于Python的构建命令，但根据文档，我们只需要在一个文件夹中的一个HTML文件来构建一个网站。你在哪里建立你的HTML将由你决定。

在图像中建立

Azure使用一个叫做Oryx的系统。你不需要太了解它的工作原理，但它会寻找特定的文件并根据这些文件选择构建规格。如果你有一个requirements.txt ，Oryx会知道使用Python。1

使用Oryx会有一些妥协。Oryx 默认使用 Python 3.8 构建。你可以通过在 yaml 文件中添加PYTHON_VERSION: "3.9.7" 更新到 Python 3.9.7。另外，你需要在PRE_BUILD_COMMAND 2中加入你的构建步骤。你可以创建shell脚本，或者添加用&& 分隔的步骤。

- 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_MY_PROJECT }}
          repo_token: ${{ secrets.GITHUB_TOKEN }} # Used for Github integrations (i.e. PR comments)
          action: "upload"
          ###### Repository/Build Configurations - These values can be configured to match your app requirements. ######
          # For more information regarding Static Web App workflow configurations, please visit: https://aka.ms/swaworkflowconfig
          app_location: "/" # App source code path
          output_location: "OUTPUT_PATH" # Built app content directory - optional
        env:
          PYTHON_VERSION: 3.9.7
          PRE_BUILD_COMMAND: 'pip --upgrade pip && pip install -r requirements.txt && python routes.py' # This can be a shell script as well

在图像之前进行构建

你可以将你的构建步骤与部署的Azure镜像分开，在Github Actions中构建。

要在GH Actions中构建环境，你需要在AzureBuild and Deploy 部分之前的yaml文件中添加一个块。你需要包括setup-python 行动，并指定你想使用的python版本。使用你的python版本的主要版本，即3.10 ，而不是3.10.5 。

接下来你需要添加运行步骤。给这个部分起一个新的名字，并输入要运行的命令。

    run: az_build.sh # My run script is routes.py

对于一个以上的命令，在开头使用|- ，每个命令都在自己的行中。

我不认为在性能上有什么不同。你的代码在做同样的事情，只是在不同的地方。使用这种方法可以绕过Oryx的Python版本限制（或者在你的构建中单独关注）。

The build in GH Actions

在推送到Github之前构建

还有一种方法。在本地构建你的网站并将其内容推送到GithHub。

你将需要手动运行你的构建步骤。最大的优点是完全控制，你不必修改你的yaml文件。

这样做的好处是如果你做了细微的改变，你不必重建整个网站。

查看你的网站

在你把代码推送到GitHub之后。你就可以看到你的网站上线了。如果你不确定URL，可以查看GitHub Actions Build，它会在构建步骤中告诉你。

The Successful build with url

你也可以刷新VS Code的Azure部分，它应该是可见的。

The new SWA in VS Code

一旦它运行起来，你就可以在Azure门户中添加一个自定义域。

  1. 遗憾的是，我认为这在使用Pipenv或Poetry的Azure静态Web应用中不起作用。

  2. 你也可以把这些步骤添加到POST_BUILD_COMMAND 。

avatar
文章
阅读
粉丝