翻译自 Waqas Anwar 2021年4月2日的文章 <A Developer's Guide To Blazor Routing and Navigation> [1] 检查传入的请求 URL 并将它们导航到对应的视图或页面是每个单页应用程序 (SPA) 框架的基本功能.Blazor Server 和 WebAssembly 应用程序也同样支持使用一些内置组件和服务进行路由.在本教程中,我将向您介绍在 Blazor 应用程序中实现路由所需了解的所有内容. Blazor 应用程序中的路由配

web最精妙的设计就是通过url把多个页面串联起来,并且可以互相跳转.我们开发系统的时候总是需要使用路由来实现页面间的跳转.传统的web开发主要是使用a标签或者是服务端redirect来跳转.那今天来看看Blazor是如何进行路由的. 使用@page指定组件的路由path 我们可以在Blazor里给每个组件指定一个path,当路由匹配的时候会显示这个组件. @page "/page/a" <h2> PAGE A </h2> @code { } 访问/page/a

之前群里大神发了一个 html5+ .NETCore的斗地主,刚好在看Blazor WebAssembly 就尝试重写试试. 还有就是有些标题党了,因为文章里几乎没有斗地主的相关实现:),这里主要介绍一些Blazor前端的一些方法实现而斗地主的实现总结来说就是获取数据绑定UI,语法上基本就是Razor,页面上的注入语法等不在重复介绍,完整实现可以查看github:https://github.com/saber-wang/FightLandlord/tree/master/src/BetGame

前言 在两年多以前就听闻 Blazor 框架,是 .Net 之父的业余实验性项目,其目的是探索 .Net 与 WebAssembly 的兼容性和应用前景.现在这个项目已经正式成为 Asp.Net Core 框架的一部分,公开了预览版,官方教程也基本写好上线了.就着这个机会,顺便体验一下这个框架用起来如何. 之前在网上搜索 Blazor 的相关信息的时候发现吵得很厉害.前端开发者大多觉得有 Vue 之类的前端 MVVM 框架已经够用,没有 C# 插足的余地.甚至很多 C# 开发者也不知道这个框架的

Blazor ❤ Serverless 我正在开发 Ant Design 的 Blazor 版本,预览页面部署在 Github Pages 上,但是加载速度很不理想,往往需要 1 分钟多钟才完成. 项目地址:https://github.com/ElderJames/ant-design-blazor 求 Star. 当寻求解决方案时,了解到了 Serverless 可以轻松地部署静态网站到腾讯云的对象存储服务上,经过尝试之后,体验非常好!访问速度就变成了 3 秒钟,心想 Blazor 与 Se

最近blazor更新很快,今天在官方博客上发布了Blazor WebAssembly 3.2.0 RC:https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-release-candidate-now-available/ ,这是最后一次预览版了,功能开发都已经完成. 5.19的微软Build大会上就正式发布了,我最近也在积极的研究学习blazor,在博客和公众号发了几篇最新版本发布的文章,在评论区还是微信群,有人问我,为什

最近Blazor热度很高,传说马上就要发布正式版了,做为微软脑残粉,赶紧也来凑个热闹,学习一下. Blazor Blazor是微软在ASP.NET Core框架下开发的一种全新的Web开发框架.Blazor利用WebAssembly使得开发者可以抛开JavaScript而使用优雅的C#来开发web单页应用.微软利用WebAssembly在浏览器里实现了一个.NET Runtime,任何.NET STANDARD 2.1的代码都可以在浏览器上运行,真的是屌炸了.Blazor强化了Razor模板引擎

前言 之前我写过一篇关于 Blazor WebAssembly 的文章浏览器中的 .Net Core —— Blazor WebAssembly 初体验,如今已经更新到 RC-1,与预览版有着较大的差异,为此补充这篇文章. 正文 与预览版的主要差异 1.这次的候选版修改了大部分包名和命名空间,因此无法通过更新包完成升级.你会发现老包一直停留在预览版.因此需要删除弃用的包,安装新的包. 2.Startup 的配置方式发生了较大变化,弱化了 Blazor 的存在感. 3.这次更新后支持在 VS 20

原文作者: Wael Kdouh 原文链接:https://medium.com/@waelkdouh/microfrontends-with-blazor-webassembly-b25e4ba3f325 我聊下最近我在做的事情,然后分享下在Blazor WebAssembly 微前端的实现细节,这篇文章是我的一些心得,以及一个示例的 Demo 项目,展示了如何使用Blazor 实现多模块分布式的应用程序的微前端,如下图所示. 为了实现上面的架构,这是我使用到了.NET 5 对与 Blazor

翻译自 Waqas Anwar 2021年5月13日的文章 <Making HTTP Requests in Blazor WebAssembly Apps> [1] 在我的前篇文章<Blazor Server 应用程序中进行 HTTP 请求>中,我介绍了在 Blazor Server 应用程序中进行 HTTP 请求的相关技术,在 Blazor Server App 中您可以访问所有的 .NET 类库和组件.但如果您创建的是 Blazor WebAssembly 应用程序,那么您的

原文:https://chrissainty.com/securing-your-blazor-apps-authentication-with-clientside-blazor-using-webapi-aspnet-core-identity/ 由于Blazor框架已经有所更新,翻译中有些内容我根据实际情况做了更改. 设置:创建解决方案 选择Blazor应用 项目名称 选择Blazor WebAssembly App(这里要勾选Asp.Net Core Host),如果找不到Blazor

ASP.NET团队如期3.16在官方博客发布了 Blazor WebAssembly 3.2.0 Preview 4:https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-preview-4-release-now-available/ ,同时在twitter上发了一条信息带上了下面这张图,这张图很形象的说明了Blazor Webassembly 正在进行最后的准备发射,按照开发计划,将在下周4.23 发布Blazor We

最美人间四月天,春光不负赶路人.在充满无限希望的明媚春天里,一路风雨兼程的.NET团队正奋力实现新的突破. 根据计划,新一代基于WebAssembly 技术研发的前端SPA框架Blazor 将于5月19日在微软Build大会升空. 目前,Blazor 的测试工作和火箭发射前各项准备工作在github 上按计划有序推进.在抗击疫情的特殊时期,力争圆满完成各项任务. ASP.NET团队如期4.23在官方博客发布了 Blazor WebAssembly 3.2.0 Preview 5:https://

5月 20日,微软 发布了 Blazor WebAssembly 3.2(https://devblogs.microsoft.com/aspnet/blazor-webassembly-3-2-0-now-available/) .Blazor是 ASP.NET Core 中的一个新框架,支持使用 C#和 HTML 创建交互式 Web 应用程序.Blazor WebAssembly 使用基于 WebAssembly 的.NET 运行时在客户端的 Web 浏览器中运行单页应用程序.在客户端,它支

前言, Blazor Assembly 需要最少 1.9M 的下载量.  ( Blazor WebAssembly 船新项目下载量测试 , 仅供参考. ) 随着程序越来越复杂, 引用的东西越来越多, 需要更多的下载量 , 有一些网站的网络可能较差, 加载这些文件需要一定的时间. 对于一些网站而言, 它不是一开始就把wasm页面暴露给游客的. wasm更加适合做的,  是一些需要与服务器进行大量交互的App类程序. 例如网站后台管理界面,  聊天后台界面, 等等. 所以, 大部分场合, 游客是先进

前言: 昨天 Blazor WebAssembly 3.2 正式发布了.  更新 VS2019后就能直接使用. 新建了两个PWA项目,  一个不用asp.net core (静态部署), 一个使用asp.net core (项目模板与服务器交互) 其中下载量主要是预压缩有没有被使用 ,  分别为  3.2M 与 1.9M  (未压缩前是11.4M) 新项目, PWA, IIS, UrlRewrite2, 动态gzip , 3.2M 项目文件夹内的文件大小如图,  可以看出,  mscorlib.

关于组件 现在前端几大轮子全面组件化.组件让我们可以对常用的功能进行封装,以便复用.组件这东西对于搞.NET的同学其实并不陌生,以前ASP.NET WebForm的用户控件其实也是一种组件.它封装html代码,封装业务逻辑,对外提供属性事件等信息,它完完全全就是个组件,只是用户控件跑在服务端,而现在的组件大多数直接跑在前端.现在Blazor Webassembly微软正式把组件带到前端,让我们看看它是怎么玩的. 第一个组件 废话不多说下面开始构建第一个组件.这个组件很简单就是绿色的面板加一个标题

一. 前言 Blazor 的整体介绍以及特点与优势,建议翻阅 Blazor 介绍. Blazor 是一个可是使用 .NET/C# 来编写交互式客户端的 Web UI 框架,在官网有一句话概括 "Build client web apps with C#".在 Blazor 里面有三个比较重要的概念: Components Blazor WebAssembly Blazor Server Components 翻译过来就是组件,是指 UI 元素,例如页面.对话框或数据输入窗体.Blazo

上一次我们学习了Blazor组件相关的知识(Asp.net Core Blazor Webassembly - 组件).这次继续学习Blazor的数据绑定相关的知识.当代前端框架都离不开数据绑定技术.数据绑定技术以数据为主导来驱动UI界面,用户对数据的修改会实时提现在UI上,极大的提高了开发效率,让开发者从繁琐的dom操作中解脱出来.对于数据绑定.NET开发者并不会陌生,WPF里大量应用数据绑定技术,有过WPF开发经验的同学其实很容易理解前端的数据绑定.总之数据绑定技术及其概念.思维极其重要.下

Blazor WebAssembly可以在浏览器上跑C#代码,但是很多时候显然还是需要跟JavaScript打交道.比如操作dom,当然跟angular.vue一样不提倡直接操作dom:比如浏览器的后退导航.反之JavaScript也有可能需要调用C#代码来实现一些功能,毕竟客户的需求是千变万化的,有的时候只能通过一些hack的手段来实现. .NET调用JavaScript函数 使用JSRuntime.InvokeVoidAsync调用无返回值的JavaScript函数 显然我们的.NET类库里

Blazor支持渐进式应用开发也就是PWA.使用PWA模式可以使得web应用有原生应用般的体验. 什么是PWA PWA应用是指那些使用指定技术和标准模式来开发的web应用,这将同时赋予它们web应用和原生应用的特性. 例如,web应用更加易于发现--相比于安装应用,访问一个网站显然更加容易和迅速,并且你可以通过一个链接来分享web应用. 在另一方面,原生应用与操作系统可以更加完美的整合,也因此为用户提供了无缝的用户体验.你可以通过安装应用使得它在离线的状态下也可以运行,并且相较于使用浏览器访问,