Welcome to use BlazorBlazor It's a use  .NET  Generate interactive clients Web UI Framework :

  • Use  C#  Instead of  JavaScript  To create information rich interactive UI.
  • Shared use .NET Written server-side and client-side application logic .
  • take UI Present as HTML and CSS, To support many browsers , These include mobile browsers .
  • And new hosting platforms ( Such as  Docker) Integrate .

Task description

Use VS2019 Template creation Blazor project , add to Dockerfile Packaging for Linux Mirror image , Finally released to Azure Application service , And view the publishing log and startup log of the image . To accomplish this mission , The following conditions need to be prepared in advance :

1) install VS2019,Docker Desktop,App Service For Container, Azure Container Registry(ACR)

2)VS 2019 Connect to China Azure account number , Refer to the article :  Connect to Microsoft cloud Azure China proper By VS 2019, VS Code, Powershell

First step : establish Blazor project

  • stay VS 2019 China creates new projects , choice Blazor App Templates ( Without this template , be Download and install Abreast of the times .Net SDK that will do ), Create contains Client End (WebAssembly) Project
  • choice MyLife.Blazor.Server The project is a startup project ,F5 Test local operation

The second step : establish Linux Mirror and deploy tests locally

  • Must be started Docker Desktop Apply and configure to use Linux Containers , The default is Windows Containers , Click on Docker Right click the run icon and select "Switch to Linux Container"

  • stay VS 2019 in , Choose MyLife.Blazor.Server project , Right click to add “Docker Support”, choice “Linux”.

add to Dockerfile The content of the document is :

#See https://aka.ms/containerfastmode to understand how Visual Studio uses this Dockerfile to build your images for faster debugging.
FROM mcr.microsoft.com/dotnet/aspnet:5.0-buster-slim AS base
EXPOSE 443 FROM mcr.microsoft.com/dotnet/sdk:5.0-buster-slim AS build
COPY ["MyLife.Blazor/Server/MyLife.Blazor.Server.csproj", "MyLife.Blazor/Server/"]
COPY ["MyLife.Blazor/Shared/MyLife.Blazor.Shared.csproj", "MyLife.Blazor/Shared/"]
COPY ["MyLife.Blazor/Client/MyLife.Blazor.Client.csproj", "MyLife.Blazor/Client/"]
RUN dotnet restore "MyLife.Blazor/Server/MyLife.Blazor.Server.csproj"
COPY . .
WORKDIR "/src/MyLife.Blazor/Server"
RUN dotnet build "MyLife.Blazor.Server.csproj" -c Release -o /app/build FROM build AS publish
RUN dotnet publish "MyLife.Blazor.Server.csproj" -c Release -o /app/publish FROM base AS final
COPY --from=publish /app/publish .
ENTRYPOINT ["dotnet", "MyLife.Blazor.Server.dll"]
  • according to VS 2019 Error prompt for , stay Docker Desktop Choose from Setting -> Resources ->File sharing Add the current project file path to .

SECURITY WARNING: You are building a Docker image from Windows against a non-Windows Docker host. All files and directories added to build context will have '-rwxr-xr-x' permissions. It is recommended to double check and reset permissions for sensitive files and directories.

  • stay Docker Desktop View in Blazor The operation of the project

The third step : Publish to ACR And open Admin Access right

  • stay VS 2019 Click publish “Publish”, choice ACR(Azure Container Registry).

  • Log in to ACR Gateway , Turn on Admin User Access right

Step four : establish App Service for Container

  • establish App Service(https://portal.azure.cn/#create/Microsoft.WebSite), choice Docker Container,Operating System by Linux. Other values are arbitrary .

  • stay Docker Choose from Image Source by ACR(Azure Container Registry). And select the last upload Image The latest version

  • After verification , Click create .

Step five : View the image pull log and Container start log

  • Log in to the App Service Portal page , Click on Container settings page , see Image Set and pull log of

  • stay App Service Portals Log Stream page , see Container start log

Be careful : If the application changes and regenerates Image, The application service is restarted (restart) And can pull the latest image and deploy .


Reference material :

Run a custom container in Azure: https://docs.microsoft.com/en-us/azure/app-service/quickstart-custom-container?pivots=container-windows#update-locally-and-redeploy

【Azure App Service For Container】 establish ASP.NET Core Blazor Project and package it as Linux Image released to Azure More articles on application services

  1. ASP.NET Core 3.0 WebApi series 【1】 establish ASP.NET Core WebApi project

    Catalog Write it at the front One . Running environment Two . Project structures, 3、 ... and . test API Four . Basic knowledge of 5、 ... and . At the end Write it at the front C# Languages can create RESTful service , It's called WebApi. Here's a summary of learning how to use support to create . Read . to update . Delete ...

  2. ASP.NET Core Blazor use Inspinia Static page template to build a simple background ( Select the menu )

    Blazor It's one for use .NET Generate interactive clients Web UI Framework : Use C# Instead of JavaScript To create rich interactivity UI. Shared use .NET Written server-side and client-side application logic ...

  3. How to integrate Azure DevOps The code published to Azure App Service in

    title : How to integrate Azure DevOps The code published to Azure App Service in author :Lamond Lu background I've been working on a couple of projects lately Azure DevOps and Azure App Servi ...

  4. improve Azure App Service Several tips for managing application performance

    This article introduces some techniques , These skills can improve Azure App Service Managed application performance . Some of these techniques are configuration changes that you can make now , Other techniques may require some redesign and refactoring of the application . Developers want to ...

  5. 【 Application service App Service】Azure App Service How to install mcrypt - PHP

    Problem description Azure App Service ( Application service ) How to install PHP An extension of mcrypt(mcrypt  yes php It is an important encryption support extension library ) Preparation conditions establish App Service, Runtime ...

  6. 【 Application service App Service】 stay Azure App Service Use in WebSocket - PHP The problem of - How to use and call

    Problem description stay Azure App Service in , Yes. .Net,Java Of WebSocket Supported sample code , But there was no success PHP Code . The following steps are based on Azure App Service Realization PH ...

  7. 【 Application service App Service】 When you meet some domain names in Azure App Service An unresolved error in , You can specify DNS Parse the server to solve

    Problem situation When access is deployed in Azure App Service The application in returns "The remote name could not be resolved: ''xxxxxx.com'" ...

  8. stay Azure WebApps Run in 64 position Asp.net Core application

    As Microsoft's next generation open source cross platform development framework , Asp.net core It is attracting more and more developers to build modern web application . at present , Azure App Service Also realized the right asp.net co ...

  9. establish ASP.NET Core MVC Applications (5)- Add query function & The new fields

    establish ASP.NET Core MVC Applications (5)- Add query function & The new fields Add query function In this paper, we will achieve the goal through Name Query user information . Update first GetAll Method to enable the query : public async ...

  10. establish ASP.NET Core MVC Applications (4)- add to CRUD Action methods and views

    establish ASP.NET Core MVC Applications (4)- add to CRUD Action methods and views establish CRUD Action method and view reference VS Built in base frame (Scaffold) System -MVC Controller with view ...

Random recommendation

  1. python day2 Common operation methods of list

    # Create list method one li = ['aa','bb','cc'] Method 2 li = list(['aa','bb','cc'])print(li) return ['aa', 'bb', 'cc']----------- ...

  2. Spring+SpringMVC+MyBatis+Maven Server side XML To configure

    Project directory structure spring-mybatis.xml <?xml version="1.0" encoding="UTF-8"?> <beans ...

  3. NullPointerException at android.widget.AbsListView.obtainView at android.widget.ListView.makeAndAddView

    Use ExpandableListView When , To quote the following wrong . Online search found that it was in CommonNumberQueryAdapter Of getGroupView() Method returns null, Pay attention to the details !!! 1 ...

  4. Use jdk operation wsdl2java (wedservice)

    open jdk Under the bin Catalog See if you can find "wsimport.exe" This file   In general, there will be   If not, your JDK This feature is not supported   And then in DOS Enter... Under the window wsimport Knock back ...

  5. C Linguistic ANSI/ISO standard

    Excerpt from :http://see.xidian.edu.cn/cpp/html/1658.html Technically, there are two C Language standards , One comes from ANSI(American National Standard Ins ...

  6. Python Study (2)

    python Based on learning ( Two )2.1 python Define a function with def, No return type ?def myabs(x) if x>0: return x python The defined function can be returned directly by multiple functions together , This and ja ...

  7. Dinic Templates

    #include <iostream> #include <cstring> #include <cstdio> #include <queue> us ...

  8. Spring AOP The pointcut expression of

    stay spring Aop To be used in AspectJ Pointcut expression language to define pointcut .Spring Support only AspectJ A subset of tangent indicators . The following table lists them Spring AOP Supported by the AspectJ Cut point indicator . stay Sp ...

  9. Baidu statistics API Use

    Baidu statistics API Use When building your own blog , I hope I can have a log system , Be able to see PV.UV Etc , At the same time, I also built a ELK System , Unfortunately, the server configuration is too low (1GHZ+1G Memory ), It doesn't work at all . You can only use a third party's Day ...

  10. [Codeforces Round #508 (Div. 2)][Codeforces 1038E. Maximum Matching]

    When I told my roommate about it a few days ago, it was very interesting , Just stick it up ... Topic link :1038E - Maximum Matching The main idea of the topic : Yes \(n\) It's a stick , Each bar has color at both ends \(c1,c2\) And his value \(v ...