65号腕-CSDN博客

原创目录

六十五号腕映像站点码云微信公众号: bigname65目录BlazorBlazor初体验Blazor之路由Blazor中如何获取查询字符串QueryString的值Blazor中的布局页面以及嵌套Blazor组件的生命周期Blazor中的参数和级联参数Blazor中如何在父子组件之间实现参数的同步刷新Blazor中bind指令的使用Blazor中的模板化组件Blazor中的事件处理Blazor中C#与Javascript的互操作Blazor与IdentitySer

2020-09-26 18:51:31 175

原创 .Net Core里面appsettings.json的使用

从.NET Core开始，项目的配置文件就换成了appsettings.json，以下整理了她的常见用法。1. IConfigurationIConfiguration是用来读取配置的接口，她在Microsoft.Extensions.Configuration.Abstractions包里面，命名空间为Microsoft.Extensions.Configuration。通常需要在使用的地方将她作为依赖注入，对于ASP.NET Core来说，已经默认实现了基于Json的配置，即这次要用到的appset

2021-03-25 21:31:49 6957

原创 EntityFramework Core 另类方式删除和更新记录

1. 问题考虑以下场景：1.1 删除记录通常的方式是先使用FirstOrDefault查出某个Entity，然后再用DbSet的Remove方法，最后调用DbContext的SaveChanges。整个过程需要先从数据库查出记录，而且是查出所有的列，难免会带来一定的性能损耗。有没有办法不查询Entity而直接删除记录？1.2 更新记录同删除一样，需要先使用FirstOrDefault查出需要更新的Entity，然后给对应的字段赋值，最后SaveChanges。同样也会带来一定的性能损耗，有没

2021-01-19 21:42:45 1169

原创为Blazor添加一个全局加载指示器

到目前为止，.NET 5已经出来了，Blazor也迎来了重大更新，之后的学习就要基于最新的.NET 5了这次主要基于Web Assembly实现一个全局的加载指示器，她主要应用于两种场景：应用第一次加载HTTP请求1. 应用加载众所周知，Web Assembly体积比较大，因此第一次加载会比较耗时，默认的程序模板中，在index.html页面里面有这么一段：<div id="app">Loading...</div>其实她就是一个简化版的加载指示器，她的作用就是在

2020-11-20 21:45:23 1722

原创 IdentityServer与Cookie的Samesite

最近在使用IdentityServer的时候碰到谷歌浏览器无法登录的问题，查看网络发现如下错误提示:The Set-Cookie was blocked because it had the “SameSite=None” attribute but did not have the secure attribute, which is required in order to use “SameSite=None”原因是因为IdentityServer在写Cookie的时候使用的是SameSit

2020-10-31 21:11:12 1285

原创 Blazor与IdentityServer4的集成(六)

Blazor Server如何使用Identity Server?前面几篇都是基于Blazor WebAssembly 的，这次来尝试一下Blazor的Server模式。根据官方的介绍，Blazor Server的认证方式其实和MVC的认证方式是一样的，同时Identity Server 也有专门介绍MVC的集成：https://identityserver4.readthedocs.io/en/latest/quickstarts/2_interactive_aspnetcore.html#cre.

2020-09-26 18:20:45 954

原创 Blazor与IdentityServer4的集成(五)

保护你的Web Api前面几篇集成了Blazor和IdentityServer，完成了登录以及指定页面的授权操作。本篇来实现与Web Api的集成，当然主要还是Web Api的认证操作。在MVC模式下，通常是借助Cookie，但是Web Api更主流的还是借助Access Token（尤其是Json Web Token），具体的概念这里就不展开说了。结合IdentityServer的例子，具体流程如下：Blazor通过IdentityServer完成登录。Blazor向IdentitySer.

2020-09-16 22:33:46 1127

原创 Blazor与IdentityServer4的集成(四)

如何实现基于权限的授权前两篇（二）,（三）实现了基于角色的授权，可以基于角色显示不同的页面，或者显示页面中不同的区域。但是实际项目当中，授权往往更精细，也更灵活。角色很有可能不是固定的，而是由用户自己创建，然后分配了不同的操作权限。本篇就以这种动态权限分配的场景，来看看如何实现授权的控制。1. 配置IdentityServerIdentityServer作为认证与授权的中心，首先需要把权限信息暴露出来。前两篇我们增加了类型为role的Claim，这次我们再增加一个类型为permission的Cl.

2020-09-04 23:15:20 719

原创 Blazor与IdentityServer4的集成(三)

如何处理多角色的问题？前一篇完成了基于角色的权限控制，但是如果一个用户有多个角色，就会有问题。原因是因为IdentityServer的多个角色是放在同一个Claim里面，她以JSON数组的形式存在，但是前面提到的Blazor认证组件是识别不了的。因此我们需要做一个转换，Blazor提供了方式让我们灵活的实现自己的扩展。首先建一个自己的工厂类：using System.Linq;using System.Security.Claims;using System.Text.Json;usin.

2020-08-28 23:06:54 721

原创 Blazor与IdentityServer4的集成(二)

我们在上一篇Blazor与IdentityServer4的集成(一)中完成了基本的配置和登录登出的操作。本篇主要完成授权的操作，包括：未登录的用户访问特定页面时自动跳到登录页面限定页面给不同的角色访问根据不同的角色显示页面不同的区域基于上一篇的实例，我们假定有两个角色，分别是管理员(Admin)和普通用户(User)，普通用户可以访问Counter页面，管理员除了Counter页面还可以访问Fetch data页面。1. 配置IdentityServer首先要做的就是给用户加上角色定义，找

2020-08-24 22:00:47 1121

原创 Blazor与IdentityServer4的集成(一)

IdentityServer4是开源的基于.Net Core的鉴权中间件，有兴趣的可以去https://github.com/IdentityServer/IdentityServer4自行了解。Blazor分为WebAssembly和Server两种模式，由于到目前为止，笔者主要学习的是WebAssembly模式，所以本文就来尝试一下WebAssembly与IdentityServer4的集成。1. 安装IdentityServer4安装IdentityServer4其实很简单，官方提供了命令行让你

2020-08-18 21:05:13 2754

原创 Blazor中C#与Javascript的互操作

做Web开发肯定离不开Javascript，Blazor虽然一定程度上可以用c#来替换Javascript的功能，但是完全抛弃Javascript肯定是不可能的，因此必然需要一种机制让C#可以和Javascript互相调用，也可以称之为互操作。从调用的方向来看可以是C#调用Javascript，也可以是Javascript调用C#。1. C#调用Javascript做Web开发的都知道Javascript脚本都是通过<script>标签来引入的，不过Blazor不能直接在Razor组件里面

2020-08-10 23:21:43 4169 1

原创 Blazor中的事件处理

同javascript一样，Blazor也支持DOM上的事件，比如onclick，onfocus，onblur等，但与javascript的写法又有些不一样。1.无参数调用直接使用@οnclick=“函数名” 就行了<button @onclick="Test">Test</button>@code { private void Test() { Console.WriteLine("test button clicked"); }}

2020-08-03 21:06:49 1857

原创 Blazor中的模板化组件

实际项目当中经常会有很多重复使用的组件，她们具有相同的布局，只是填充的内容不一样，如果不停的复制粘贴也是件费劲的事情，而且也不好维护和更新，这时候就可以考虑使用模板化组件。比如以下Bootstrap自带的Card组件：红色框的部分就是公共的部分，我们可以把她们封装到模板化组件里。1. RenderFragment模板化组件需要用到RenderFragment类型的参数。对于上面的例子，我们可以分成Header和Body两个部分，如下：<div cla

2020-07-29 20:44:49 1221

原创 Blazor中bind指令的使用

在上一篇中, 第一次用到了@bind指令，她主要用来做数据绑定，有以下几种使用方式：@bind@bind:event@bind-{参数名或属性名}@bind-{参数名或属性名}:eventbind是区分大小写的，所以只能用小写的bind，不能用BIND等其他形式具体怎么用？我们一个一个看。1. @bind@bind主要用来实现双向绑定，比如如下代码：<h3>Page:Bind Sample</h3>双向：<input type="text" @bin

2020-07-22 21:03:06 3604

原创 Blazor中如何在父子组件之间实现参数的同步刷新

1.问题在上一篇参数和级联参数中，我们了解了参数的使用，但是那个主要是单向的。假设有下面两个组件:：子组件Counter，她接受一个参数，并且在每次点击按钮的时候给参数加1。<h3>Child Count: @CurrentCount</h3><button class="btn btn-primary" @onclick="IncrementCount">Child Add<

2020-07-19 22:48:57 4544

原创 Blazor中的参数和级联参数

1. 参数(Parameter)参数主要用来在各组件之间传递值，在初始项目的SurveyPrompt组件中就包含了一个参数: [Parameter] public string Title { get; set; }通过用Parameter修饰符来修饰，就可以将指定的属性（注意要是public的）声明为参数，使用也很简单：<SurveyPrompt Title="这里是参数的值" />2. CaptureUnmatchedValues我们来看看的定义Paramete

2020-07-16 21:08:16 7719 1

原创 Blazor组件的生命周期

组件,英文称之为Component，包括普通页面，布局页，用户控件等.直接看官方文档, Blazor组件的生命周期按从前往后分为以下几个阶段：SetParametersAsync，接受到参数，初始化之前。OnInitialized，初始化之后。OnInitializedAsync，初始化之后（需要处理异步方法的时候用到）。OnParametersSet，设置完参数之后。OnParametersSetAsync，设置完参数之后（需要处理异步方法的时候用到）。OnAfterRender，组件呈现

2020-07-14 20:28:26 4060

原创 Blazor中的布局页面以及嵌套

定义布局页面布局页面(layout)，习惯上我更喜欢称之为模板页，或者母版页。她的作用是用来呈现页面上的一些公共元素，或者托管一些公共的逻辑代码。先来看看Blazor的默认布局：图中红色区域即是布局页里面的内容，对应的代码是MainLayout.razor，如下：@inherits LayoutComponentBase<div class="sidebar"> <NavMenu /></div><div class="main">

2020-07-06 20:42:22 3660 1

原创 Blazor中如何获取查询字符串QueryString的值

上一篇中提到了Blazor中的路由设置，我们使用类似@page “/users/{id}”的指令来定义路由参数，那么Blazor能不能使用查询字符串QueryString呢？笔者特意试了以下形式的路由设置：@page “/users?id={id}”很不幸，这样是不行的。但是查询字符串实在是太常用了，比如列表的查询页面，很可能会有多种不同的参数组合，如果完全依靠路由定义就会很繁琐。那么应该如何才能取到QueryString里面的值呢？回顾上一篇，里面提到了NavigationManager类，

2020-07-03 23:00:54 4584 1

原创 .Net Core Web Api 中如何处理全局异常

使用场景在请求Web Api的时候难免会碰到一些未处理的异常，此时服务器通常会返回500错误，为了更好的用户体验，我们需要捕获全局的未处理异常，并返回一个友好的错误信息给调用端。解决方案从.Net Core 开始，微软引入了中间件的概念，通过中间件我们可以拦截到所有的http请求，也可以捕获到所有未处理的异常。首先我们要定义一个中间件，如下：public class ExceptionHandlingMiddleware{ private readonly RequestDelega

2020-06-30 22:51:12 1531

原创 Blazor之路由

路由的常用场景Web开发当中，路由是指页面之间的相互跳转，最常见的有以下两种情况：浏览器输入地址或者点击链接业务代码的定向跳转不管通过哪种方式，其实本质上都是一样的，都是通过URL的来定位到对应的页面。这里还是以WebAssembly的项目为基础来探索一下路由的功能吧。对项目结构不清楚的朋友可以先看上一篇Blazor 初体验。浏览器输入地址或者点击链接通过上一篇Blazor 初体验我们已经知道每个页面都有个@page指令来定义该页面对应的URL。比如：@page "/"@page "

2020-06-25 16:29:53 1476

原创怎样在Winform窗体中嵌入Web浏览器

背景项目当中需要在Winform窗体中嵌入网页，虽然微软自带了WebBrowser控件，但是她是以IE模式运行的，兼容性实在太差，找了一圈发现有个叫CefSharp的家伙还不错，于是就拿来玩了一下。CefSharp 主要特征支持.NET Framework 4.5.2+支持Winform，WPF基于Chromium内核支持Javascript互操作BSD商业开源,地址https://github.com/cefsharp/CefSharp快速入门注：笔者的环境是Visual Studi

2020-06-23 22:23:40 2752

原创 Blazor 初体验

什么是Blazor通过官方的介绍可以知道，Blazor是一个Web端的UI框架。但与现在流行的UI框架(Angular，VUE等)不同，Blazor 是允许使用C#来代替一些Javascript功能的，而且可以在UI端和服务端共享业务逻辑代码。听起来就很有吸引力，作为一个多年的.NET癌，自然要尝试一下。创建创建Blazor项目需要Visual Studio 2019 以上版本，笔者用的是Version 16.6.2。新建项目，选择Blazor App，然后点击下一步.输入项目名称，点击创建

2020-06-17 20:46:44 1807

六十五号腕