使用Jexus 容器化您的 Blazor 应用程序
在本文中,我们将介绍如何将 Blazor 应用程序放入Jexus 容器以进行开发和部署。我们将使用 .NET Core CLI,因此无论平台如何,使用的命令都将是相同的。
Blazor 托管模型
Blazor 有两个托管模型,它们的要求不同,本文主要基于WebAssembly模型介绍容器化。
- Blazor WebAssembly:一个 Web 框架,用于在浏览器中使用 WebAssembly 运行客户端。
- Blazor 服务器:运行服务器端并使用 SignalR 与浏览器通信的 Web 框架。
WebAssembly 托管模型的目标是在浏览器中托管整个应用程序。Blazor WebAssembly 应用程序中的项目包括 HTML、JavaScript、.NET 运行时版本和二进制文件。它们都在浏览器中运行,因此您可以将它托管为静态网站。不需要服务器运行时或解释器。
Blazor WebAssembly 仍处于预览模式,是最后一个预览版,5.19 将正式发布,因此您必须手动安装模板才能创建 Blazor WebAssembly 应用程序。
dotnet new -i Microsoft.AspNetCore.Components.WebAssembly.Templates::3.2.0-rc1.20223.4
现在,您已经安装了模板,您可以使用以下 .NET CLI 命令创建新的 Web 组装应用程序:
dotnet new blazorwasm -o wasmtest
这将创建一个新的 Blazor WebAssembly 应用程序,名称为"wasmtest"。您可以将"wasmtest" 更改为项目名称。
生成并测试应用后,即可发布应用。运行点网发布命令:
dotnet publish -c Release
你会看到如下输出:
PS C:\workshop\idt2019\wasmtest> dotnet publish -c Release -o publish
用于 .NET Core 的 Microsoft (R) 生成引擎版本 16.5.0+d4cbfca49
版权所有(C) Microsoft Corporation。保留所有权利。
C:\workshop\idt2019\wasmtest\wasmtest.csproj 的还原在 93.3 ms 内完成。
wasmtest -> C:\workshop\idt2019\wasmtest\bin\Release\netstandard2.1\wasmtest.dll
wasmtest (Blazor output) -> C:\workshop\idt2019\wasmtest\bin\Release\netstandard2.1\wwwroot
wasmtest -> C:\workshop\idt2019\wasmtest\publish\
在这里,你可以看到我们的程序的文件都发布到了路径C:\workshop\idt2019\wasmtest\publish\, 我们的所有成果输出都是静态文件,都放在文件夹wwwroot 目录下:
PS C:\workshop\idt2019\wasmtest\publish> ls wwwroot
目录: C:\workshop\idt2019\wasmtest\publish\wwwroot
Mode LastWriteTime Length Name
---- ------------- ------ ----
d----- 2020/5/4 12:38 css
d----- 2020/5/4 12:38 sample-data
d----- 2020/5/4 12:38 _framework
-a---- 2020/5/4 12:34 32038 favicon.ico
-a---- 2020/5/4 12:34 651 index.html
可以从任何静态web 站点上运行这个文件,我们就使用一个Jexus 容器来运行blazor 应用。Jexus 是一款国产的 Linux 平台上的高性能WEB服务器 和负载均衡网关,以支持 ASP.NET、 ASP.NET CORE、 PHP 为特色, 同时具备反向代理、 入侵 检测等重要功能。 可以这样说, Jexus是 .NET、 .NET CORE 跨平台的最优秀的宿主服务器,如 果我们认为它是 Linux平台 的 IIS ,这并不为过,因为, Jexus 不但非常快,而且拥有 IIS 和 其它 Web 服务器所不具备的高度的安全性,这是政府机构和重要企业对web服务器最必要也是最重要的 品质需求。张志敏同学在维护这个Jexus镜像,得到了Jexus作者宇内流云的认可, Docker Hub 地址: https://hub.docker.com/r/beginor/jexus-x64。
我们来创建一个Jexus 托管静态网站的配置wasmtest:
######################
# Web Site: wasmtest.csharpkit.com
########################################
port=80
root=/ /var/www/wasmtest/
hosts= wasmtest.csharpkit.com
NoFile=/index.html
UseGZIP=true
创建一个容器打包镜像的Dockerfile:
FROM beginor/jexus-x64:6.2.1.12
COPY ./jexus/wasmtest /usr/jexus/siteconf/wasmtest
COPY ./publish/wwwroot /var/www/wasmtest
CMD [ "jws", "start"]
此文件将拉下jexus 镜像,然后将jexus网站的配置文件复制到容器文件系统中的(默认的jexus 配置文件夹)。它将在每次生成镜像时执行此操作,因此如果你需要对项目进行更改,则需要重新生成镜像。
这就是我们需要启动和运行Blazor WebAssembly静态文件所需的以前,现在我们就来创建一个镜像:
docker build –f ./Dockfile –t geffzhang/wasmtest:lastest .
PS C:\workshop\idt2019\wasmtest> docker build -f .\Dockerfile -t geffzhang/wasmtest:lastest .
Sending build context to Docker daemon 29.42MB
Step 1/4 : FROM beginor/jexus-x64:6.2.1.12
6.2.1.12: Pulling from beginor/jexus-x64
68ced04f60ab: Already exists 08da89b1ce63: Pull complete e1c7e1fba2a2: Pull complete 7bb8aca5914e: Pull complete Digest: sha256:385f8a80d06dc25cc72e072e57983316c7c4faa5e793825fc3bea3fe09701e0c
Status: Downloaded newer image for beginor/jexus-x64:6.2.1.12
---> d2b984e7898c
Step 2/4 : COPY ./jexus/wasmtest /usr/jexus/siteconf/wasmtest
---> 1ffe6bdc10de
Step 3/4 : COPY ./publish/wwwroot /var/www/wasmtest
---> a60b338191aa
Step 4/4 : CMD [ "jws", "start"]
---> Running in da8c19f7849b
Removing intermediate container da8c19f7849b
---> a04cf465b883
Successfully built a04cf465b883
Successfully tagged geffzhang/wasmtest:lastest
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 run –name wasm1 –p 80:80 –d geffzhang/wasmtest:lastest
PS C:\workshop\idt2019\wasmtest> docker run --name wasm1 -p 80:80 -d geffzhang/wasmtest:lastest
101ecc49b5913d69300a7554022ecef681760922640fc39faf6195d69e04bb56
这将容器作为守护进程运行,因此他将能够持续运行,直到你停止它。现在我们有了一个静态的Jexus 服务器在端口80上运行应用程序。你可以通过浏览器上看到它:

在生产环境中,我们可以通过Jexus配置更多的操作,上面这些步骤是托管你的Blazor WebAssembly 应用程序在容器中进行开发。
代码参见:https://github.com/BlazorHub/wasmtest
使用Jexus 容器化您的 Blazor 应用程序的更多相关文章
- Asp.NetCore轻松学-使用Docker进行容器化托管
前言 没有 docker 部署的程序是不完整的,在写了 IIS/Centos/Supervisor 3篇托管介绍文章后,终于来到了容器化部署,博客园里面有关于 docker 部署的文章比比皆是,作为硬 ...
- ASP.NET Core应用程序容器化、持续集成与Kubernetes集群部署(一)(转载)
本文结构 ASP.NET Core应用程序的构建 ASP.NET Core应用程序容器化所需注意的问题 应用程序的配置信息 端口侦听 ASP.NET Core的容器版本 docker镜像构建上下文(B ...
- docker4dotnet #2 容器化主机
.NET 猿自从认识了小鲸鱼,感觉功力大增.上篇<docker4dotnet #1 前世今生&世界你好>中给大家介绍了如何在Windows上面配置Docker for Window ...
- 面向UI编程:ui.js 1.0 粗糙版本发布,分布式开发+容器化+组件化+配置化框架,从无到有的艰难创造
时隔第一次被UI思路激励,到现在1.0的粗糙版本发布,掐指一算整整半年了.半年之间,有些细节不断推翻重做,再推翻再重做.时隔今日,终于能先出来个东西了,这个版本很粗糙,主体功能大概能实现了,但是还是有 ...
- .NET Core容器化@Docker
温馨提示:本文适合动手演练,效果更佳. 1. 引言 我们知道. NET Core最大的特性之一就是跨平台,而对于跨平台,似乎大家印象中就是可以在非Windows系统上部署运行.而至于如何操作,可能就 ...
- .NET Core容器化之多容器应用部署@Docker-Compose
1.引言 紧接上篇.NET Core容器化@Docker,这一节我们先来介绍如何使用Nginx来完成.NET Core应用的反向代理,然后再介绍多容器应用的部署问题. 2. Why Need Ngin ...
- .NET Core+MySql+Nginx 容器化部署
.NET Core容器化@Docker .NET Core容器化之多容器应用部署@Docker-Compose .NET Core+MySql+Nginx 容器化部署 GitHub-Demo:Dock ...
- .NET微服务 容器化.NET应用架构指南(支持.NET Core2)
介绍 企业通过使用容器,日益实现成本节约.解决部署问题并改进 DevOps 和生产操作. 通过创建 Azure 容器服务.Azure Service Fabric 等产品,同时与 Docker.Mes ...
- 容器化的 DevOps 工作流
对于 devops 来说,容器技术绝对是我们笑傲江湖的法宝.本文通过一个小 demo 来介绍如何使用容器技术来改进我们的 devops 工作流. devops 的日常工作中难免会有一些繁琐的重复性劳动 ...
随机推荐
- MySQL学习之路2-数据库and数据表的基本操作
数据库基本操作 查看.选择数据库: show databases; use <databasename>; 创建数据库:create database <dbname> cha ...
- 中阶 d05 tomcat 安装 eclipse上配置tomcat
eclipse使用参考 https://www.bilibili.com/video/av49438855/?p=24 1. 直接解压 ,然后找到bin/startup.bat 2. 可以安装 启动之 ...
- File类心得
File类心得 在程序中设置路径时会有系统依赖的问题,java.io.File类提供一个抽象的.与系统独立的路径表示.给它一个路径字符串,它会将其转换为与系统无关的抽象路径表示,这个路径可以指向一个文 ...
- Python 文件拼接
# -*- coding:utf-8 -*- import re import csv file = open('make_setup.cfg', 'w+') with open("tyb. ...
- 【Tool】IDEA 连接数据库
窗口 View - DataBase 右侧的窗口弹出,点加号选择数据库 没有装载驱动包,提示下载 可以选择老版本的驱动,或者新版的 老版本驱动只需要填入数据库,账户和密码即可测试链接,显示连接成功 新 ...
- 【LeetCode】23.合并K个排序链表
题目描述 23.合并K个排序链表 合并k个排序链表,返回合并后的排序链表.请分析和描述算法的复杂度. 示例: 输入: [ 1->4->5, 1->3->4, 2->6 ] ...
- 5000+图片找到你喜欢的那个TA,Python爬虫+颜值打分
前言 文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问题请及时联系我们以作处理. 作者: 罗罗攀 PS:如有需要Python学习资料的小伙伴可以加点击下方链接 ...
- cheat sheet 简介
cheat sheet 速查表 /小抄 如果期末考试老师只让你让带一张A4纸,合法"作弊",纸上能写多少全凭自己本事,你会写什么?大部分人应该把整个课程的知识重点梳理一遍,方便记忆 ...
- A - Free DIY Tour HDU - 1224
题目大意:每一个城市都有一定的魅力值,然后有一个有向图,根据这个有向图从1到n+1所获得的魅力的最大值,并输出路径(要求只能从编号娇小的城市到编号较大的城市). 题解:很容易想到最短路+路径纪录.但是 ...
- Gradle系列之Groovy基础篇
原文发于微信公众号 jzman-blog,欢迎关注交流. 上一篇学习了 Gradle 的入门知识,Gradle 基于 Groovy,今天学习一下 Groovy 的基础知识,Groovy 是基于 JVM ...