欢迎使用 BlazorBlazor 是一个使用 .NET 生成交互式客户端 Web UI 的框架:

  • 使用 C# 代替 JavaScript 来创建信息丰富的交互式 UI。
  • 共享使用 .NET 编写的服务器端和客户端应用逻辑。
  • 将 UI 呈现为 HTML 和 CSS,以支持众多浏览器,其中包括移动浏览器。
  • 与新式托管平台(如 Docker)集成。

任务描述

使用VS2019模板创建Blazor项目,添加Dockerfile打包为Linux镜像,最后发布到Azure应用服务, 并查看镜像的发布日志和启动日志。要完成这次任务,需要提前准备以下条件:

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

2)VS 2019 连接到中国区Azure账号,可参考文章: 连接到微软云Azure中国区 By VS 2019, VS Code, Powershell

第一步:创建Blazor项目

  • 在VS 2019中创建新项目,选择Blazor App模板(如无此模板,则下载并安装最新的.Net SDK即可),创建包含Client端(WebAssembly)的项目
  • 选择MyLife.Blazor.Server项目为启动项目,F5测试本地运行情况

第二步:创建Linux镜像并本地部署测试

  • 必须启动Docker Desktop应用并配置为使用Linux容器,默认为Windows容器,点击Docker运行图标右键选择"Switch to Linux Container"

  • 在VS 2019中,选中MyLife.Blazor.Server项目,右键添加“Docker Support”,选择“Linux”。

添加Dockerfile的文件内容为:

#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
WORKDIR /app
EXPOSE 80
EXPOSE 443 FROM mcr.microsoft.com/dotnet/sdk:5.0-buster-slim AS build
WORKDIR /src
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
WORKDIR /app
COPY --from=publish /app/publish .
ENTRYPOINT ["dotnet", "MyLife.Blazor.Server.dll"]
  • 根据VS 2019的错误提示,在Docker Desktop中选择Setting -> Resources ->File sharing中添加当前项目文件路径。

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.

  • 在Docker Desktop中查看Blazor项目运行情况

第三步:发布到ACR并开启Admin访问权限

  • 在VS 2019中点击发布“Publish”,选择ACR(Azure Container Registry).

  • 登录到ACR门户,开启Admin User访问权限

第四步:创建App Service for Container

  • 创建App Service(https://portal.azure.cn/#create/Microsoft.WebSite),选择Docker Container,Operating System为Linux。其他值则随意而定。

  • 在Docker中选择Image Source为ACR(Azure Container Registry)。 并选择上一步上传的Image最新版

  • 验证完成后,点击创建即可。

第五步:查看镜像拉取日志及Container启动日志

  • 登录到第四步创建的App Service门户页面,点击Container settings页面,查看Image的设置及拉取日志

  • 在App Service门户的Log Stream页面,查看Container启动日志

注意:如果应用修改后重新生成了Image,应用服务通过重启(restart)及可以拉取最新的镜像并部署。

(Source:https://docs.microsoft.com/en-us/azure/app-service/quickstart-custom-container?pivots=container-windows#update-locally-and-redeploy)

参考资料:

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】创建ASP.NET Core Blazor项目并打包为Linux镜像发布到Azure应用服务的更多相关文章

  1. 【Azure App Service】C#下制作的网站,所有网页本地测试运行无误,发布至Azure之后,包含CHART(图表)的网页打开报错,错误消息为 Runtime Error: Server Error in '/' Application

    问题描述 C#下制作的网站,所有网页本地测试运行无误,发布至Azure之后,包含CHART(图表)的网页打开报错,错误消息为 Runtime Error: Server Error in '/' Ap ...

  2. ASP.NET Core 3.0 WebApi 系列【1】创建ASP.NET Core WebApi 项目

    目录 写在前面 一.运行环境 二.项目搭建 三.测试 API 四.基础知识 五.写在最后 写在前面 C#语言可以创建RESTful服务,被称作WebApi.在这里总结学习使用支持创建.读取.更新.删除 ...

  3. 学习ASP.NET Core Blazor编程系列二——第一个Blazor应用程序(中)

    学习ASP.NET Core Blazor编程系列一--综述 学习ASP.NET Core Blazor编程系列二--第一个Blazor应用程序(上) 四.创建一个Blazor应用程序 1. 第一种创 ...

  4. ASP.NET Core Blazor 用Inspinia静态页模板搭建简易后台(实现菜单选中)

    Blazor 是一个用于使用 .NET 生成交互式客户端 Web UI 的框架: 使用 C# 代替 JavaScript 来创建丰富的交互式 UI. 共享使用 .NET 编写的服务器端和客户端应用逻辑 ...

  5. 【Azure 应用服务】App Service For Container 配置Nginx,设置/home/site/wwwroot/目录为启动目录,并配置反向代理

    问题描述 通过Docker Desktop for Linux,配置Nginx镜像后,自定义nginx.conf文件,修改启动目录和对 /out 路径的反向代理到博客园的博文地址 (https://w ...

  6. Azure App Service(一)利用Azure DevOps Pipeline 构建镜像,部署应用程序

    一,引言 起因是前两天项目上做测试,需要我把写好的基于.NET 5 的 Web 测试程序作成 Docker 镜像.当我在本地验证完功能后,准备利用 Docker 构建应用程序镜像的时候,发现系统不支持 ...

  7. 如何将Azure DevOps中的代码发布到Azure App Service中

    标题:如何将Azure DevOps中的代码发布到Azure App Service中 作者:Lamond Lu 背景 最近做了几个项目一直在用Azure DevOps和Azure App Servi ...

  8. 改善Azure App Service托管应用程序性能的几个技巧

    本文介绍了几个技巧,这些技巧可以改善Azure App Service托管应用程序的性能.其中一些技巧是你现在就可以进行的配置变更, 而其他技巧则可能需要对应用程序进行一些重新设计和重构. 开发者都希 ...

  9. 【应用服务 App Service】Azure App Service 中如何安装mcrypt - PHP

    问题描述 Azure App Service (应用服务)如何安装PHP的扩展 mcrypt(mcrypt 是php里面重要的加密支持扩展库) 准备条件 创建App Service, Runtime ...

随机推荐

  1. 图的建立以及应用(BFS,DFS,Prim)

    关于带权无向图的一些操作 题目:根据图来建立它的邻接矩阵,通过邻接矩阵转化为邻接表,对邻接表进行深度优先访问和广度优先访问,最后用邻接矩阵生成它的最小生成树: 1.输入一个带权无向图(如下面图1和图2 ...

  2. Django项目连接多个数据库配置

    1.设置数据库连接 pip install PyMySQL 2.在项目同名目录myproject/myproject下的__init__.py添加以下代码 import pymysql pymysql ...

  3. rocketMq broker.conf全部参数解释

    #4.7.1版本 #所属集群名字brokerClusterName=rocketmq-cluster#broker名字,名字可重复,为了管理,每个master起一个名字,他的slave同他,eg:Am ...

  4. 类818tu.c微信小说分销系统设计之定时模板消息源码

    近期将出个系列讲解开发过程,同时作为此系统的开发记录吧,万能的博客园,本边讲解如何发送模板消息,并且能够定时发送,下一篇讲解如何处理多个公众号的网页授权登录问题 [后台]http://xiaoshuo ...

  5. Netty源码解析 -- PoolChunk实现原理(jemalloc 3的算法)

    前面文章已经分享了Netty如何实现jemalloc 4算法管理内存. 本文主要分享Netty 4.1.52之前版本中,PoolChunk如何使用jemalloc 3算法管理内存. 感兴趣的同学可以对 ...

  6. Solon 特性简集,相较于 Springboot 有什么区别?

    Solon 是一个类似Springboot的微型开发框架,也是一个不基于Servlet的开发框架.项目从2018年启动以来,参考过大量前人作品:历时两年,3500多次的commit:内核保持0.1m的 ...

  7. 动态SQL基本语句用法

    1.if语句 如果empno不为空,则在WHERE参数后加上AND empno = #{empno},这里有1=1所以即使empno为null,WHERE后面也不会报错. 映射文件 <selec ...

  8. git 只提交部分文件 拉取pull远程仓库

    正常的团队开发中,在提交代码push之前要先pull拉取远程仓库的代码.而拉取pull操作需要先commit修改的文件才能成功. 那么问题来了,当我只想push提交部分代码的时候,同样需要pull拉取 ...

  9. Hadoop3.2.0+Centos7三节点完全分布式安装配置

    一.环境准备 ①准备三台虚拟机,配置静态IP ②先修改主机名(每个节点统一命名规范) vim /etc/hostname master #重启生效 配置DNS每个节点 vim /etc/hosts 1 ...

  10. Access-Control-Allow-Headers等基础常识

    跨源资源共享 (CORS) (或通俗地译为跨域资源共享)是一种机制,该机制使用附加的 HTTP 头来告诉浏览器,准许运行在一个源上的Web应用访问位于另一不同源选定的资源. 当一个Web应用发起一个与 ...