尝试在 VS Code 中使用

部署容器化应用到 Azure

在本指南中,你将学习如何

  • 为你的应用程序创建容器镜像。
  • 将镜像推送到容器注册表。
  • 将镜像部署到 Azure App Service 或 Azure Container Apps。

先决条件

创建应用程序镜像

如果你已有镜像,请跳过此步骤,直接执行将镜像推送到容器注册表步骤。

  1. 在 VS Code 中打开应用程序文件夹。

  2. 打开命令面板 (⇧⌘P (Windows, Linux Ctrl+Shift+P)),然后使用容器镜像:构建镜像...命令来构建镜像。

    Build container image

    你可以在“构建镜像”命令的输出中找到镜像名称,也可以在容器资源管理器的“镜像”窗格中找到。

    Build image output

将镜像推送到容器注册表

在将镜像部署到 App Service 或容器应用之前,必须将镜像上传到容器注册表。可以将镜像上传到 Azure Container Registry (ACR)Docker Hub

  1. 打开容器资源管理器,选择 注册表 组下的 连接注册表... 图标,并按照提示进行操作。选择提供程序(Azure 或 Docker Hub)并提供连接到注册表的凭据。

    Connect to Registry

  2. 现在,注册表将显示在“注册表”下。

    Registries

  3. 可选:为镜像添加标签。为了将镜像上传到注册表,需要使用注册表名称标记镜像,以便 docker push 命令能够将其上传到正确的注册表。

    • 要在 Azure ACR 中创建注册表,请打开容器资源管理器的 注册表 部分,如果尚未登录,请登录 Azure,然后右键单击要使用的订阅,选择 创建注册表

    • 上一节中构建的镜像将显示在容器资源管理器“镜像”部分下。右键单击并选择 标记...

      Tag image

    • 指定新名称 <你的注册表或用户名>/<镜像名称>:<标签> 并完成标记操作。例如,对于名为 WebApp6 的 ACR,新的镜像名称将是 'webapp6.azurecr.io/webapp6:latest';对于 Docker Hub,新的镜像名称将是 'myusername/webapp6:latest'。

  4. 镜像将显示在容器资源管理器中镜像标签指向的注册表下。选择此镜像并选择 推送。如果镜像尚未添加标签,系统将提示你选择要推送到的注册表,并根据选择为镜像添加标签。

    Push image

  5. 推送命令完成后。刷新镜像推送到的注册表节点,上传的镜像将显示出来。

    Refresh registry

将镜像部署到 Azure

在上一节中,镜像已被推送到远程容器注册表。现在将此镜像部署到 Azure App Service 或 Azure Container Apps。

  1. 在容器资源管理器中,导航到“注册表”下的镜像,右键单击标签,然后选择 将镜像部署到 Azure App Service...将镜像部署到 Azure Container Apps...

    Deploy to Azure App Service

  2. 出现提示时,为 App Service 或容器应用提供值。

    • 新 Web 应用名称:该名称在 Azure 中必须是唯一的。
    • 资源组:选择现有资源组或创建新资源组。
    • App Service 计划:选择现有 App Service 计划或创建新计划。(App Service 计划定义托管网站的物理资源;本教程中你可以使用基本或免费计划层级)。
  3. 部署完成后,Visual Studio Code 会显示一条包含网站 URL 的通知。

    Deployment complete notification

  4. 你也可以在 Visual Studio Code 的输出面板的“容器工具”部分中查看结果。

    Deployment complete output

  5. 要浏览已部署的网站,你可以使用 Ctrl+click 在输出面板中打开 URL。你可能需要稍等片刻,直到应用在 Azure 中启动。新的 App Service 或容器应用也会显示在 Visual Studio Code 的 Azure 视图中,你可以在其中右键单击网站并选择 浏览网站

    Web Application

后续步骤

继续阅读以了解更多信息:

  • Azure 扩展 - VS Code 市场中有数百个用于 Azure 和云的扩展。
  • 部署到 Azure - 了解如何将应用程序逐步部署到 Azure。
  • 使用 MongoDB - 在 VS Code 中创建、管理和查询 MongoDB 数据库。