快速入门:部署 ASP.NET Web 应用

本快速入门介绍如何创建第一个 ASP.NET Web 应用并将其部署到 Azure 应用服务。 应用服务支持各种版本的 .NET 应用,并提供高度可缩放、自修补的 Web 托管服务。 ASP.NET Web 应用具有跨平台特性,可以在 Linux 或 Windows 上托管。 完成后,你将获得一个 Azure 资源组,其中包含一个应用服务托管计划,以及一个部署了 Web 应用程序的应用服务。

提示

.NET Core 3.1 是 .NET 的当前长期支持 (LTS) 版本。 有关详细信息,请参阅 .NET 支持策略

必备条件

  • 具有活动订阅的 Azure 帐户。 创建试用版订阅

  • Visual Studio 2019 与“ASP.NET 和 Web 开发”工作负载。

    如果已安装 Visual Studio 2019:

    • 通过选择“帮助” > “检查更新”,在 Visual Studio 中安装最新更新。
    • 通过选择“工具” > “获取工具和功能”,添加工作负荷。

安装最新的 .NET Core 3.1 SDK。

安装最新的 .NET Core 3.1 SDK。

创建 ASP.NET Web 应用

  1. 打开 Visual Studio,然后选择“创建新项目”。

  2. 在“创建新项目”中,找到并选择“ASP.NET Web Core 应用”,然后选择“下一步”。

  3. 在“配置新项目”中,将应用程序命名为“MyFirstAzureWebApp”,然后选择“下一步”。

    配置 ASP.NET Core 3.1 Web 应用

  4. 选择“.NET Core 3.1(长期支持)”。

  5. 确保“身份验证类型”设置为“无身份验证”。 选择“创建”。

    Visual Studio - 选择“.NET Core 3.1”和“无身份验证”作为“身份验证类型”。

  6. 在 Visual Studio 菜单中,选择“调试” > “开始执行(不调试)”以在本地运行 Web 应用。

    Visual Studio -.NET Core 3.1 本地浏览

创建名为“MyFirstAzureWebApp”的新文件夹,并在 Visual Studio Code 中打开。 打开“终端”窗口,并使用 dotnet new webapp 命令创建新的 .NET Web 应用。

dotnet new webapp -f netcoreapp3.1

在 Visual Studio Code 的“终端”中,使用 dotnet run 命令本地运行该应用程序。

dotnet run

打开 Web 浏览器并导航到 https://localhost:5001 处的应用。

你将看到页面中显示的模板 ASP.NET Core 3.1 Web 应用。

Visual Studio Code - 在浏览器中本地运行 .NET Core 3.1。

在计算机上打开终端窗口,进入工作目录。 使用 dotnet new webapp 命令创建新的 .NET Web 应用,然后将目录更改为新创建的应用。

dotnet new webapp -n MyFirstAzureWebApp -f netcoreapp3.1 && cd MyFirstAzureWebApp

在同一终端会话中,使用 dotnet run 命令本地运行该应用程序。

dotnet run

打开 Web 浏览器并导航到 https://localhost:5001 处的应用。

你将看到页面中显示的模板 ASP.NET Core 3.1 Web 应用。

Visual Studio Code - 本地浏览器中的 ASP.NET Core 3.1。

发布 Web 应用

若要发布 Web 应用,必须先创建并配置一个可将应用发布到的新应用服务。

在设置应用服务的过程中,将会创建:

  • 一个新的资源组,用于包含该服务的所有 Azure 资源。
  • 一个新的托管计划,用于指定托管应用的 Web 服务器场的位置、大小和功能。

遵循以下步骤创建应用服务并发布 Web 应用:

  1. 在“解决方案资源管理器”中右键单击“MyFirstAzureWebApp”项目,然后选择“发布”。

  2. 在“发布”中,选择“Azure”,然后单击“下一步”。

    Visual Studio - 发布 Web 应用和目标 Azure。

  3. 你的选项取决于你是否已登录 Azure 以及是否有一个链接到 Azure 帐户的 Visual Studio 帐户。 选择“添加帐户”或“登录”以登录 Azure 订阅。 如果你已经登录,请选择所需的帐户。

    Visual Studio - 选择“登录到 Azure”对话框。

  4. 选择特定目标,即 Azure 应用服务 (Linux) 或 Azure 应用服务 (Windows)。

    重要

    面向 ASP.NET Framework 4.8 时,将使用 Azure 应用服务 (Windows)。

  5. 在“应用服务实例”的右侧,选择 +

    Visual Studio - “新建应用服务”应用对话框。

  6. 对于“订阅”,请接受列出的订阅,或从下拉列表中选择一个新订阅。

  7. 对于“资源组”,选择“新建”。 在“新资源组名称”中,输入“myResourceGroup”并选择“确定”。

  8. 对于“托管计划”,请选择“新建”。

  9. 在“托管计划:新建”对话框中,输入下表中指定的值:

    设置 建议的值 说明
    托管计划 MyFirstAzureWebAppPlan 应用服务计划的名称。
    位置 中国北部 托管 Web 应用的数据中心。
    大小 免费 定价层确定托管功能。

    创建新的托管计划

  10. 名称 中,输入仅包含有效字符 a-zA-Z0-9- 的唯一应用名称。 可以接受自动生成的唯一名称。 Web 应用的 URL 为 http://<app-name>.chinacloudsites.cn,其中 <app-name> 是应用名称。

  11. 选择“创建”以创建 Azure 资源。

    Visual Studio - “创建应用资源”对话框。

    向导完成后,便为你创建了 Azure 资源,你就可以进行发布了。

  12. 选择“完成”关闭向导。

  13. 在“发布”页中,选择“发布”。 Visual Studio 将生成、打包应用并将其发布到 Azure,然后在默认浏览器中启动该应用。

    你将看到页面中显示的 ASP.NET Core 3.1 Web 应用。

    Visual Studio - Azure 中的 ASP.NET Core 3.1 Web 应用。

使用 Visual Studio Azure 工具扩展部署 Web 应用:

  1. 在 Visual Studio Code 中,打开“命令面板”,快捷键为 Ctrl+Shift+P

  2. 搜索并选择“Azure 应用服务:部署到 Web 应用”。

  3. 响应提示,如下所述:

    • 选择“MyFirstAzureWebApp”作为要部署的文件夹。
    • 在出现提示时选择“添加配置”。
    • 如果出现提示,请登录到你现有的 Azure 帐户。

    Visual Studio Code - 登录到 Azure。

    • 选择 订阅
    • 选择“创建新 Web 应用…高级”。
    • 对于“输入全局唯一名称”,请使用在所有 Azure 中都是唯一的名称(有效字符为 a-z0-9-)。 良好的模式是结合使用公司名称和应用标识符。
    • 选择“创建新的资源组”并提供一个名称,例如 myResourceGroup
    • 当系统提示“选择运行时堆栈”时:
      • 对于 .NET Core 3.1,选择 .NET Core 3.1 (LTS)
      • 对于 .NET 5.0,选择 .NET 5
      • 对于 .NET Framework 4.8,选择 ASP.NET V4.8
    • 选择操作系统(Windows 或 Linux)。
      • 对于 .NET Framework 4.8,将隐式选择 Windows。
    • 选择“创建新的应用服务计划”,提供一个名称,然后选择“F1 免费”定价层
    • 对于 Application Insights 资源,选择“暂时跳过”。
    • 选择附近的位置。
  4. 发布完成后,选择通知中的“浏览网站”,并在出现提示时选择“打开”。

    你将看到页面中显示的 ASP.NET Core 3.1 Web 应用。

    Visual Studio Code - Azure 中的 ASP.NET Core 3.1 Web 应用。

使用 az webapp up 命令在本地“MyFirstAzureWebApp”目录中部署代码:

az webapp up --sku F1 --name <app-name> --os-type <os>
  • 如果无法识别 az 命令,请确保已按照 必备条件 中所述安装了 Azure CLI。
  • <app-name> 替换为在整个 Azure 中均唯一的名称(有效字符为 a-z0-9-)。 良好的模式是结合使用公司名称和应用标识符。
  • --sku F1 参数在“免费”定价层上创建 Web 应用。 省略此参数可使用更快的高级层,这会按小时计费。
  • linuxwindows 替换 <os>。 面向 ASP.NET Framework 4.8 时,必须使用 windows
  • 可以选择包含参数 --location <location-name>,其中 <location-name> 是可用的 Azure 区域。 可以运行 az account list-locations 命令来检索 Azure 帐户的允许区域列表。

此命令可能需要花费几分钟时间完成。 运行时,它提供以下相关信息:创建资源组、应用服务计划和托管应用,配置日志记录,然后执行 ZIP 部署。 然后,此命令使用应用的 URL 输出一条消息:

You can launch the app at http://<app-name>.chinacloudsites.cn

打开 Web 浏览器并导航到 URL:

你将看到页面中显示的 ASP.NET Core 3.1 Web 应用。

CLI - Azure 中的 ASP.NET Core 3.1 Web 应用。

更新应用并重新部署

遵循以下步骤更新并重新部署 Web 应用:

  1. 在“解决方案资源管理器”中你的项目下,打开“Index.cshtml”。

  2. 将第一个 <div> 元素替换为以下代码:

    <div class="jumbotron">
        <h1>.NET 💜 Azure</h1>
        <p class="lead">Example .NET app to Azure App Service.</p>
    </div>
    

    保存更改。

  3. 若要重新部署到 Azure,请在“解决方案资源管理器”中右键单击“MyFirstAzureWebApp”项目,然后选择“发布”。

  4. 在“发布”摘要页中选择“发布” 。

    发布完成后,Visual Studio 将启动浏览器并转到 Web 应用的 URL。

    你将看到页面中显示的更新之后的 ASP.NET Core 3.1 Web 应用。

    Visual Studio - Azure 中更新之后的 ASP.NET Core 3.1 Web 应用。

  1. 打开 index.cshtml

  2. 将第一个 <div> 元素替换为以下代码:

    <div class="jumbotron">
        <h1>.NET 💜 Azure</h1>
        <p class="lead">Example .NET app to Azure App Service.</p>
    </div>
    

    保存更改。

  3. 打开 Visual Studio Code 侧栏,选择“Azure”图标以展开其选项。

  4. 在“应用服务”节点下,展开你的订阅,然后右键单击“MyFirstAzureWebApp”。

  5. 选择“部署到 Web 应用…”。

  6. 出现提示时,选择“部署”。

  7. 发布完成后,选择通知中的“浏览网站”,并在出现提示时选择“打开”。

    你将看到页面中显示的更新之后的 ASP.NET Core 3.1 Web 应用。

    Visual Studio Code - Azure 中更新之后的 ASP.NET Core 3.1 Web 应用。

在本地目录中,打开 Index.cshtml 文件。 替换第一个 <div> 元素:

<div class="jumbotron">
    <h1>.NET 💜 Azure</h1>
    <p class="lead">Example .NET app to Azure App Service.</p>
</div>

保存更改,然后再次使用 az webapp up 命令重新部署应用:

ASP.NET Core 3.1 具有跨平台特性,基于你以前将 <os> 替换为 linuxwindows 的部署。

az webapp up --os-type <os>

此命令使用本地缓存在 .azure/config 文件中的值,包括应用名称、资源组和应用服务计划。

完成部署后,切换回在“浏览到应用” 步骤中打开的浏览器窗口,并点击“刷新”。

你将看到页面中显示的更新之后的 ASP.NET Core 3.1 Web 应用。

CLI - Azure 中更新之后的 ASP.NET Core 3.1 Web 应用。

管理 Azure 应用

若要管理 Web 应用,请转到 Azure 门户,然后搜索并选择“应用服务”。

Azure 门户 - 选择“应用服务”选项。

在“应用服务”页上,选择 Web 应用的名称。

Azure 门户 - “应用服务”页面,显示已选择一个示例 Web 应用。

Web 应用的“概述”页包含用于基本管理(例如浏览、停止、启动、重启和删除)的选项。 左侧菜单提供用于配置应用的更多页面。

Azure 门户 - 应用服务概述页面。

清理资源

在前面的步骤中,在资源组中创建了 Azure 资源。 如果认为将来不需要这些资源,可以通过删除资源组来删除它们。

  1. 在 Azure 门户的 Web 应用的“概述”页中,选择“资源组”下的 myResourceGroup 链接。
  2. 在资源组页中,确保列出的资源是要删除的资源。
  3. 选择“删除”,在文本框中键入 myResourceGroup,然后选择“删除”。

清理资源

在前面的步骤中,在资源组中创建了 Azure 资源。 如果认为将来不需要这些资源,可以通过删除资源组来删除它们。

  1. 在 Azure 门户的 Web 应用的“概述”页中,选择“资源组”下的 myResourceGroup 链接。
  2. 在资源组页中,确保列出的资源是要删除的资源。
  3. 选择“删除”,在文本框中键入 myResourceGroup,然后选择“删除”。

清理资源

若要删除通过此快速入门创建的所有资源,请运行以下命令:

az group delete --name myResourceGroup

后续步骤

本快速入门介绍如何创建 ASP.NET Web 应用并将其部署到 Azure 应用服务。

请继续学习下一篇文章,了解如何创建 .NET Core 应用并将其连接到 SQL 数据库: