azure web应用部署_如何在Azure上部署Blazor应用程序

最新推荐文章于 2024-08-17 07:00:00 发布

cumian9828

最新推荐文章于 2024-08-17 07:00:00 发布

阅读量292

点赞数

文章标签：数据库 java mysql python linux

原文链接：https://www.freecodecamp.org/news/how-to-deploy-a-blazor-application-on-azure-cf6f3b1f03a0/

版权

azure web应用部署

介绍 (Introduction)

In this article, we will learn how to deploy an ASP.NET Core hosted Blazor application on Azure. We will use Visual Studio 2017 to publish the app. We will create a SQL database server on Azure to handle DB operations.

在本文中，我们将学习如何在Azure上部署ASP.NET Core托管的Blazor应用程序。我们将使用Visual Studio 2017来发布应用程序。我们将在Azure上创建一个SQL数据库服务器来处理数据库操作。

先决条件 (Prerequisites)

Install the .NET Core 2.1 or above SDK from here
从此处安装.NET Core 2.1或更高版本的SDK
Install Visual Studio 2017 v15.7 or above from here
从此处安装Visual Studio 2017 v15.7或更高版本
Install ASP.NET Core Blazor Language Services extension from here
从此处安装ASP.NET Core Blazor语言服务扩展
An Azure subscription account. You can create a free Azure account here
Azure订阅帐户。您可以在此处创建一个免费的Azure帐户

Please refer to my previous article Cascading DropDownList in Blazor Using EF Core to create the application that we will be deploying in this tutorial.

请参考我以前的文章《使用Blazor使用EF Core来级联DropDownList》以创建将在本教程中部署的应用程序。

在Azure门户上创建资源组 (Create a resource group on Azure portal)

We will create a resource group on Azure portal to contain all our resources on Azure.

我们将在Azure门户上创建一个资源组，以包含我们在Azure上的所有资源。

Login to Azure portal and click on Resource groups on the left menu and then click Add. It will open a “Resource group” window as shown in the image below:

登录到Azure门户，然后单击左侧菜单上的“ Resource groups ，然后单击“添加”。它将打开一个“资源组”窗口，如下图所示：

In this window we need to fill the following details:

在此窗口中，我们需要填写以下详细信息：

Resource group name: Give a unique name to your resource group. Here we will use the name BlazorDDLGroup.
资源组名称 ：为资源组指定一个唯一的名称。在这里，我们将使用名称BlazorDDLGroup 。
Subscription: Select your subscription type from the drop down. Here we are selecting the “free trial” subscription.
订阅：从下拉列表中选择您的订阅类型。在这里，我们选择“免费试用”订阅。
Resource group location: Select a location for your resource group from the drop down.
资源组位置 ：从下拉列表中选择资源组的位置 。

在Azure上创建SQL DB和DB服务器 (Creating SQL DB and DB server on Azure)

We will create the SQL database and a database server on the Azure portal to handle our DB operations.

我们将在Azure门户上创建SQL数据库和数据库服务器来处理数据库操作。

Click on SQL databases on the left menu of your Azure portal and then click Add. It will open a “SQL Database” window as shown in the image below:

单击Azure门户左侧菜单上的SQL databases ，然后单击“添加”。它将打开一个“ SQL数据库”窗口，如下图所示：

Here you need to fill in the following details:

在这里您需要填写以下详细信息：

Database name: Put in a name for your database. Here we will use DDLDemodb as our DB name.
数据库名称 ：输入数据库名称 。在这里，我们将使用DDLDemodb作为数据库名称。
Subscription: Select your subscription type from the drop down. Here we are selecting the “free trial” subscription.
订阅：从下拉列表中选择您的订阅类型。在这里，我们选择“免费试用”订阅。
Resource group: Select the resource group name that we have created in the previous step.
资源组 ：选择我们在上一步中创建的资源组名称。
Select source: This drop down contains a list of databases with predefined data provided by Azure. Since we are creating our custom database, select Blank database from this dropdown.
选择源 ：此下拉列表包含由Azure提供的具有预定义数据的数据库列表。由于我们正在创建自定义数据库，因此从此下拉列表中选择“ Blank database 。
Pricing tier: Select a pricing tier for your database.
定价层 ：为数据库选择一个定价层。

Before creating the database, we need to create a database server for the SQL database. Click on the “Server configure required settings” and then click Create a new server. It will open a “New server” window as shown in the image below:

在创建数据库之前，我们需要为SQL数据库创建一个数据库服务器。单击“服务器配置所需的设置”，然后单击“ Create a new server 。它将打开一个“新服务器”窗口，如下图所示：

Here we need to furnish the following details:

在这里，我们需要提供以下详细信息：

Server name: Provide a name for your DB server. Here we will use ddldemoserver. The DB server will be created by appending .database.windows.net to the user provided server name. Hence, the server name will be ddldbserver.database.windows.net in this case.
服务器名称 ：提供数据库服务器的名称。在这里，我们将使用ddldemoserver 。通过将.database.windows.net附加到用户提供的服务器名称来创建数据库服务器。因此，在这种情况下，服务器名称将为ddldbserver.database.windows.net 。
Server admin login: Put an admin login name for your DB server.
服务器管理员登录名：输入数据库服务器的管理员登录名。
Password: Put the login password corresponding to the admin login for your DB server.
密码：输入与您的数据库服务器的管理员登录名相对应的登录密码。
Location: Select a location for your server from the dropdown.
位置：从下拉列表中选择服务器的位置。

Check the “Allow Azure services to access server” check box and click on Select to create your DB Server.

选中“允许Azure服务访问服务器”复选框，然后单击“ Select以创建数据库服务器。

Note: The word “admin” is restricted for the administrator user name of the database server. Use any other username than “admin”.

注意： “ admin”一词仅限于数据库服务器的管理员用户名。使用除“ admin”以外的任何其他用户名。

Once the DB server gets created, you will be redirected back to the “SQL Database” window. You need to click on the “Create” button to create your database.

创建数据库服务器后，您将被重定向回“ SQL数据库”窗口。您需要单击“创建”按钮来创建数据库。

Here is the whole process explained in a gif.

这是gif中解释的整个过程。

创建数据库表 (Creating DB tables)

The database DDLDemodb do not contain the tables that we are using in our application. We will connect to Azure database using SQL Server Management Studio (SSMS) to create our DB objects.

数据库DDLDemodb不包含我们在应用程序中使用的表。我们将使用SQL Server Management Studio(SSMS)连接到Azure数据库以创建数据库对象。

Open SSMS in your machine and put the server name as ddldbserver.database.windows.net. Provide the admin user id and password that you have configured in the previous section. Then click on “Connect”.

在您的计算机中打开SSMS，并将服务器名称命名为ddldbserver.database.windows.net 。提供您在上一节中配置的管理员用户ID和密码。然后点击“连接”。

You will get a pop up window for configuring the firewall rule to access the Azure DB. Login with your Azure account credentials and add your machine’s IP address under Firewall rule. Click on OK to connect to the Azure database server. Refer to the image below:

您将弹出一个窗口，用于配置防火墙规则以访问Azure数据库。使用Azure帐户凭据登录，然后在“ Firewall rule下添加计算机的IP地址。单击“确定”以连接到Azure数据库服务器。请参考下图：

Once the connection is successful, you can see the DDLDemodb database on the server. Refer to my previous article Cascading DropDownList in Blazor Using EF Core. Run the SQL commands to create and insert sample data in the Country and Cities tables that we are using in our application.

连接成功后，您可以在服务器上看到DDLDemodb数据库。请参阅我以前的文章使用EF Core在Blazor中级联DropDownList 。运行SQL命令以在我们在应用程序中使用的Country和Cities表中创建示例数据并将其插入。

设置数据库连接字符串 (Setting the DB connection string)

After creating the database objects, we need to replace the connection string of local database in our application with the connection string of the Azure database.

创建数据库对象后，我们需要用Azure数据库的连接字符串替换应用程序中本地数据库的连接字符串。

Open Azure portal and click on SQL databases on the left menu. It will open a window displaying the list of all the databases that you created on the Azure portal. Click on DDLDemodb database and select Connection strings from the menu. Select the ADO.NET tab and copy the connection string. Refer to the image below:

打开Azure门户，然后单击左侧菜单上的SQL databases 。它将打开一个窗口，显示您在Azure门户上创建的所有数据库的列表。单击DDLDemodb数据库，然后从菜单中选择“ Connection strings ”。选择ADO.NET选项卡，然后复制连接字符串。请参考下图：

You need to put the admin user id and password for the database server that you have configured earlier in this connection string.

您需要在此连接字符串中放置之前配置的数据库服务器的管理员用户ID和密码。

Open the BlazorDDL application using Visual Studio, navigate to BlazorDDL.Shared/Models/myTestDBContext.cs and replace the local connection sting with this new connection string.

使用Visual Studio打开BlazorDDL应用程序，导航到BlazorDDL.Shared/Models/myTestDBContext.cs然后用此新的连接字符串替换本地连接字符串。

Launch your application from Visual Studio to verify if the new connection string is configured correctly and you are able to access the Azure database.

从Visual Studio启动应用程序，以验证新连接字符串是否配置正确，并且您能够访问Azure数据库。

If the application is not working and you are unable to connect to the database, then check if your connection string is correct or not. Once the application is working as expected in your local machine then move to the next section to publish it on Azure.

如果应用程序无法运行，并且您无法连接到数据库，请检查您的连接字符串是否正确。应用程序在本地计算机上按预期运行后，请移至下一部分以在Azure上发布它。

将Blazor应用程序发布到Azure (Publishing the Blazor application to Azure)

To publish the Blazor app on Azure, Right-click on the Server project of your solution and click publish. In this case, it will be BlazorDDL.Server >> Publish.

要在Azure上发布Blazor应用，请右键单击解决方案的Server项目，然后单击“发布”。在这种情况下，它将是BlazorDDL.Server >> P Publish。

It will open the Pick a publish target window. Select App Service from the left menu. Select the Create New radio button and click on the “Create profile” button. Refer to the image below:

它将打开“ Pick a publish target窗口。从左侧菜单中选择“ App Service ”。选择Create New单选按钮，然后单击“创建配置文件”按钮。请参考下图：

The next window will ask you to login to your Azure account if you are not logged in. Once the login is successful, a Create App Service window will open. Refer to the image below:

如果未登录，则下一个窗口将询问您是否登录到Azure帐户。成功登录后，将打开“ Create App Service窗口。请参考下图：

The fields of this window have default values in them as per the configuration of your Azure account. However, you can change these values depending on your requirements.

根据您的Azure帐户的配置，此窗口的字段中具有默认值。但是，您可以根据需要更改这些值。

You can fill the details as mentioned below:

您可以按如下所述填写详细信息：

App Name: Provide an app name for your application. The app name is subject to availability. If the app name you provided is already in use, then you need to give a new app name. The website’s public URL will be App Name followed by .azurewebsites.net. Here we are using the name BlazorDDLDemo, hence the URL for our website will be BlazorDDLDemo.azurewebsites.net.
应用名称 ：为您的应用提供一个应用名称。应用名称视情况而定。如果您提供的应用名称已在使用中，则需要提供一个新的应用名称。该网站的公共URL将是App Name，后跟.azurewebsites.net 。在这里，我们使用名称BlazorDDLDemo ，因此我们网站的URL为BlazorDDLDemo.azurewebsites.net 。
Subscription: Select your subscription type from the drop down list.
订阅：从下拉列表中选择您的订阅类型。
Resource Group: Select your resource group name, which is BlazorDDLGroup in this case.
资源组 ：选择您的资源组名称，在这种情况下为BlazorDDLGroup 。
Hosting Plan: You can either use the existing plan or select a new plan by clicking on the “New…” link.
托管计划 ：您可以使用现有计划，也可以通过单击“新建…”链接来选择新计划。
Application Insights: You can choose a value from the dropdown list. It will provide analytics for your website.
应用程序见解 ：您可以从下拉列表中选择一个值。它将为您的网站提供分析。

Click on the “Create” button to start the application deployment on Azure. It will take few minutes to complete depending on your internet connection speed.

单击“创建”按钮以在Azure上启动应用程序部署。根据您的互联网连接速度，可能需要几分钟才能完成。

After the deployment is successful, click on the “Publish” button to publish the app to Azure. Once the application is published successfully, the website will be launched automatically in the default browser of your machine. You can also access the website using the URL BlazorDDLDemo.azurewebsites.net.

部署成功后，单击“发布”按钮以将应用程序发布到Azure。成功发布该应用程序后，该网站将在您计算机的默认浏览器中自动启动。您也可以使用URL BlazorDDLDemo.azurewebsites.net访问该网站。

You can see the application in your browser as shown in the image below:

您可以在浏览器中看到该应用程序，如下图所示：

结论 (Conclusion)

In this article, we learned how to deploy and publish a Blazor application on Azure. We created a SQL database and DB server on Azure and used them in our application to handle the DB operations.

在本文中，我们学习了如何在Azure上部署和发布Blazor应用程序。我们在Azure上创建了一个SQL数据库和数据库服务器，并在应用程序中使用它们来处理数据库操作。

Get my book Blazor Quick Start Guide to learn more about Blazor.

获取我的书《 Blazor快速入门指南》，以了解有关Blazor的更多信息。

You can also read my other articles here.

您也可以在这里阅读我的其他文章。