认证方式简述

Blazor Server微软官方还是推荐直接使用Cookie授权,因为本来Blazor Server就是前后端不分离的。不存在Cookie跨域等一系列问题。

只要不是使用SSO之类的统一登录方式,建议直接使用Cookie作为认证方式就行,简单方便。

添加Cookie认证

Blazor添加Cookie认证的方式跟MVC没什么区别,也是在Program.cs里添加对应的认证中间件。

  1. 添加Cookie认证方式

builder.Services.AddAuthentication(CookieAuthenticationDefaults.AuthenticationScheme).AddCookie();
  1. 增加认证中间件

app.UseAuthentication();
app.UseAuthorization();

这个处理是不是跟使用MVC的时候一模一样?

这里需要注意,Blazor Server只有第一次连接的时候会走中间件,之后连接成功就是SingalR了,不会每个请求都走中间件,所以之前的MVC的那种在中间件或者过滤器里进行处理的路子走不通了。

新建Login.razor

我们需要新建一个登录页面,本篇暂时只是放一个占位页,不实现登录,下一篇我们再来完成登录。

这里需要注意,Login页面应该是独立布局的,不应该有MainLayout的菜单布局,但是我们在App.razor里指定了默认布局,这里怎么办呢。

我们选用一种最简单的办法,就是新建一个空布局,让Login页面使用我们的空布局。

首先我们在Shared里面新建一个LoginLayout,这个就是一个空Layout。

LoginLayout.razor

@inherits LayoutComponentBase

@Body

标准的一个Layout模板,继承于LayoutComponentBase,然后里面只有一个@Body

然后新建一个Login.razor,指定它的布局为LoginLayout

Login.razor

@page "/Login"
@layout LoginLayout <h3>Login</h3>

创建RedirectToLogin组件

这个组件没有其他任何作用,就是在未登录时跳转到登录页面。

REdirectToLogin.razor

@inject NavigationManager NavigationManager

@code {
protected override void OnInitialized()
{
base.OnInitialized();
NavigationManager.NavigateTo("/Login", true);
}
}

这里注意,NavigationManager.NavigateTo("/Login", true);方法在Debug时会报错,这个错误我个人认为是微软的锅,在.net 6上目前没找到什么合适的解决办法。这里报错就直接点击继续,不会有任何其他影响,并且Release下不会报错。如果你用Rider的Run来执行,也不会报错。

如果各位大佬知道如何能解决这个报错,请留言告诉我一下,感激不尽。

修改App.razor

这里我们需要把原来的RouteView修改为AuthorizeRouteView

这个AuthorizeRouteView是Blazor自带的一个授权组件,它内部处理了授权信息,内部有NotAuthorizedAuthorizing可供使用。

  • NotAuthorized即未授权的情况,这种情况如果不写,默认好像是显示一行文字,Not Authorized。内部是一个RenderFragment所以可以添加任何内容。

  • Authorizing是授权认证中显示的文字,我们使用Cookie认证的话一般不会有这种情况,但是如果我们使用统一认证,或者其他网络认证的时候,可能会有等待认证的时间,这时候就会显示这里的内容。

我们需要的是跳转到登录页面,所以我们就在NotAuthorized的时候加载我们的RedirectToLogin的组件即可。

<NotAuthorized>
<RedirectToLogin></RedirectToLogin>
</NotAuthorized>

Index页面增加授权

这个最简单,就是在需要授权的页面上增加[Authorize]标签即可。

@attribute [Authorize]

这样我们直接F5运行程序,应该就会发现自动跳转到了Login路径下。

从零开始Blazor Server(3)--添加cookie授权的更多相关文章

  1. 从零开始Blazor Server(4)--登录系统

    说明 上一篇文章中我们添加了Cookie授权,可以跳转到登录页了.但是并没有完成登录,今天我们来完成它. 我们添加Cookie授权的时候也说了,这套跟MVC一模一样,所以我们登录也是跟MVC一模一样. ...

  2. 从零开始Blazor Server(1)--项目搭建

    项目介绍 本次项目准备搭建一个使用Furion框架,Blazor的UI使用BootstrapBlazor.数据库ORM使用Freesql的后台管理系统. 目前的规划是实现简单的注册,登录.增加管理员跟 ...

  3. 从零开始Blazor Server(15)--总结

    我们用了14篇文章,基本上把一个后台管理系统需要的UI部分都说的差不多了.所以这套文章也该到了结束的时候了. 这里面有很多问题,比如我们直接使用UI来拉数据库信息而没有使用service,再比如我们大 ...

  4. 从零开始Blazor Server(10)--编辑角色

    例图 目前的样式是这样的: 其中角色在一个table里,然后可以增删改查,并且可以给指定的用户分配权限. 创建文件 首先我们在Pages/Admin目录下新建一个Role.razor.因为我们的Adm ...

  5. 从零开始Blazor Server(6)--基于策略的权限验证

    写这个的原因 现在BootstrapBlazor处于大更新时期,Menu组件要改为泛型模式. 本来我们的这一篇应该是把Layout改了,但是改Layout肯定要涉及到菜单,如果现在写了呢,就进入一个发 ...

  6. 从零开始Blazor Server(8)--增加菜单以及调整位置

    这篇干啥 这篇文章主要是把前面的一些东西稍微调整一下,使其更适合后面的内容. 主要是两个事,一个是把原来的PermissionEntity直接变成MenuEntity,直接让最后一级是菜单,这样后面就 ...

  7. 从零开始Blazor Server(2)--整合数据库

    开篇 上一篇文章我们留了个尾巴,没有把freesql整合进去,这篇文章我们来整合. 目前的思路呢,是做一个简单的四不像的RABC,也有用户.角色. 权限三部分. 但是其中每个用户只有一个角色,即用户和 ...

  8. 从零开始Blazor Server(11)--编辑用户

    用户编辑和角色编辑几乎一模一样,这里先直接贴代码. @page "/user" @using BlazorLearn.Entity @using Furion.DataEncryp ...

  9. 从零开始Blazor Server(12)--编辑菜单

    上个星期有点事,导致没法及时更新.现在我们继续更我们的从零开始系列. 这个系列也快要结束了,目前规划再有2-3篇,就结束了. 今天我们来说编辑菜单的问题,说实话菜单这种东西,你不更新代码加个页面,单独 ...

随机推荐

  1. Java学习笔记-学生管理系统

    Java学习笔记 一个Student类 public class Student { private String sid; private String name; private String a ...

  2. EF Core 配置模型

    0 前言 本文的第一节,会概述配置模型的作用(对数据模型的补充描述). 第二节描述两种配置方式,即:数据注释(data annotations)和 Fluent API 方式. 第三节开始,主要是将常 ...

  3. Nginx基本配置与应用

    一.准备 1.1 环境准备 CentOS7软件环境 1.2 tomcat多实例 把/etc/profile.d/tomcat.sh中的变量注释了 #export TOMCAT_HOME=/usr/lo ...

  4. 好客租房13-在jsx中使用javascript表达式

    嵌入js表达式 数据存储在js中 语法{javascript表达式} 注意语法中是单大括号 不是双大括号 //导入react     import React from "react&quo ...

  5. mysql配置与存储引擎与字段类型与约束条件

    目录 字符编码与配置文件 存储引擎 创建表的完整语法 字段类型 整型 浮点型 字符类型 数字的含义 枚举与集合 日期类型 约束条件 字符编码与配置文件 在MySQL5.X系列中,显示的字符编码有多种, ...

  6. 【摸鱼神器】一次搞定 vue3的 路由 + 菜单 + tabs

    做一个管理后台,首先要设置路由,然后配置菜单(有时候还需要导航),再来一个动态tabs,最后加上权限判断. 这个是不是有点繁琐?尤其是路由的设置和菜单的配置,是不是很雷同?那么能不能简单一点呢?如果可 ...

  7. nginx 代理请求导出功能bug解决方法

    问题描述: nginx代理的ip直接访问可以直接下载文件,但是通过nginx访问就报502,nginx错误日志:upstream sent invalid chunked response while ...

  8. 记一次前端CryptoJS AES解密

    1.背景 业务需求,需要联动多个平台,涉及到各平台的模拟登录. 已知加密前明文且正常登录.(无验证码要求) 某平台验证验证方式为.\login接口POST一串json字符串 { "accou ...

  9. python+selenium 自动化测试——显式等待详解

    1.前言 之前有提到过等待函数,等待函数分为:强制等待(sleep).隐式等待(implicitly_wait),显示等待(WebDriverWait),这次以显示等待方式专门做一次总结,因为我个人是 ...

  10. Lucene从入门到实战

    Lucene 在了解Lucene之前,我们先了解下全文数据查询. 全文数据查询 我们的数据一般分为两种:结构化数据和非结构化数据 结构化数据:有固定格式或有限长度的数据,如数据库中的数据.元数据 非结 ...