Publish an ASP.NET Core web app to Azure App Service using Visual Studio

By Rick Anderson, Cesar Blum Silveira, and Rachel Appel

Set up the development environment

Create a web app

In the Visual Studio Start Page, select File > New > Project...

File menu

Complete the New Project dialog:

  • In the left pane, select .NET Core.

  • In the center pane, select ASP.NET Core Web Application.

  • Select OK.

New Project dialog

In the New ASP.NET Core Web Application dialog:

  • Select Web Application.

  • Select Change Authentication.

New Project dialog

The Change Authentication dialog appears.

  • Select Individual User Accounts.

  • Select OK to return to the New ASP.NET Core Web Application, then select OK again.

New ASP.NET Core Web authentication dialog

Visual Studio creates the solution.

Run the app locally

  • Choose Debug then Start Without Debugging to run the app locally.

  • Click the About and Contact links to verify the web application works.

Web application open in Microsoft Edge on localhost

  • Select Register and register a new user. You can use a fictitious email address. When you submit, the page displays the following error:

    "Internal Server Error: A database operation failed while processing the request. SQL exception: Cannot open the database. Applying existing migrations for Application DB context may resolve this issue."

  • Select Apply Migrations and, once the page updates, refresh the page.

Internal Server Error: A database operation failed while processing the request. SQL exception: Cannot open the database. Applying existing migrations for Application DB context may resolve this issue.

The app displays the email used to register the new user and a Log out link.

Web application open in Microsoft Edge. The Register link is replaced by the text Hello email@domain.com!

Deploy the app to Azure

Close the web page, return to Visual Studio, and select Stop Debugging from the Debug menu.

Right-click on the project in Solution Explorer and select Publish....

Contextual menu open with Publish link highlighted

In the Publish dialog, select Microsoft Azure App Service and click Publish.

Publish dialog

  • Name the app a unique name.

  • Select a subscription.

  • Select New... for the resource group and enter a name for the new resource group.

  • Select New... for the app service plan and select a location near you. You can keep the name that is generated by default.

App Service dialog

  • Select the Services tab to create a new database.

  • Select the green + icon to create a new SQL Database

New SQL Database

  • Select New... on the Configure SQL Database dialog to create a new database.

New SQL Database and server

The Configure SQL Server dialog appears.

  • Enter an administrator user name and password, and then select OK. Don't forget the user name and password you create in this step. You can keep the default Server Name.

  • Enter names for the database and connection string.

Note

"admin" is not allowed as the administrator user name.

Configure SQL Server dialog

  • Select OK.

Visual Studio returns to the Create App Service dialog.

  • Select Create on the Create App Service dialog.

Configure SQL Database dialog

  • Click the Settings link in the Publish dialog.

Publish dialog: Connection panel

On the Settings page of the Publish dialog:

  • Expand Databases and check Use this connection string at runtime.

  • Expand Entity Framework Migrations and check Apply this migration on publish.

  • Select Save. Visual Studio returns to the Publish dialog.

Publish dialog: Settings panel

Click Publish. Visual Studio will publish your app to Azure and launch the cloud app in your browser.

Test your app in Azure

  • Test the About and Contact links

  • Register a new user

Web application opened in Microsoft Edge on Azure App Service

Update the app

  • Edit the Pages/About.cshtml Razor page and change its contents. For example, you can modify the paragraph to say "Hello ASP.NET Core!":

    @page
    @model AboutModel
    @{
        ViewData["Title"] = "About";
    }
    <h2>@ViewData["Title"]</h2>
    <h3>@Model.Message</h3>
    
    <p>Hello ASP.NET Core!</p>
    
  • Right-click on the project and select Publish... again.

Contextual menu open with Publish link highlighted

  • After the app is published, verify the changes you made are available on Azure.

Verify task is complete

Clean up

When you have finished testing the app, go to the Azure portal and delete the app.

  • Select Resource groups, then select the resource group you created.

Azure Portal: Resource Groups in sidebar menu

  • In the Resource groups page, select Delete.

Azure Portal: Resource Groups page

  • Enter the name of the resource group and select Delete. Your app and all other resources created in this tutorial are now deleted from Azure.

Next steps