一个 .net 8 + Azure 登录 + Ant Design Blazor 的基本后台框架

一个 .net 8 + Azure 登录 + Ant Design Blazor 的基本后台框架

主界面使用了 Ant Design Blazor 项目模板搭建

后台技术是 .net 8 Blazor run at server 模式

登录方式使用 Azure

实现了菜单导航和路由

此外实现了读取和修改本地Json文件的功能,不是必须的,不需要的可以拿掉,我是自己项目需要

点击下载

由于没有对权限进行细分,所以没有做菜单的权限控制,基本上有 Azure 账户就能登录进来,如果要细分,也很简单,就是在 Azure 的 Claims 里做文章,这里也不说了

Azure 登录的关键代码在 BasicLayout.razor,这点跟传统的登录以后再跳转有些不一样

cs 复制代码
@namespace Bestrane.OPS.Web
@inherits LayoutComponentBase
@inject NavigationManager _navigationManager
<CascadingAuthenticationState>
    <Router AppAssembly="@typeof(Program).Assembly">
        <Found Context="routeData">
            <AuthorizeView>
                <Authorized>
                    <AntDesign.ProLayout.BasicLayout Logo="@("https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg")"
                                                     MenuData="_menuData">
                        <RightContentRender>
                            <Bestrane.OPS.Web.Components.RightContent />
                        </RightContentRender>
                        <ChildContent>
                            @Body
                        </ChildContent>
                        <FooterRender>
                            <FooterView Copyright="2024 BOPS" Links="Links"></FooterView>
                        </FooterRender>
                    </AntDesign.ProLayout.BasicLayout>
                    <SettingDrawer />
                </Authorized>
                <NotAuthorized>
                    <div class="main__b__0">
                        <div class="login">
                            <Card Title="BOPS" Style="width:300px;">
                                <Body>
                                    <Button Type="@ButtonType.Primary" OnClick="HandleSubmit">
                                        Azure Login
                                    </Button>
                                </Body>
                            </Card>
                        </div>
                    </div>
                    @* <li><a href="MicrosoftIdentity/Account/SignIn">Log in</a></li> *@
                </NotAuthorized>
            </AuthorizeView>
        </Found>
    </Router>
    <AntContainer />
</CascadingAuthenticationState>

@code
{
    public void HandleSubmit()
    {
        _navigationManager.NavigateTo("MicrosoftIdentity/Account/SignIn", true);
    }

    private MenuDataItem[] _menuData = { };

    [Inject] public HttpClient? _httpClient { get; set; }

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();
        _menuData = await _httpClient.GetFromJsonAsync<MenuDataItem[]>("data/menu.json");
    }

    public LinkItem[] Links { get; set; } = new LinkItem[] { };
}
相关推荐
liangshanbo12152 小时前
深入理解 Model Context Protocol (MCP):从原理到实践
开发语言·qt·microsoft
武藤一雄4 小时前
[奇淫巧技] WPF篇 (长期更新)
windows·microsoft·c#·.net·wpf
ITHAOGE156 小时前
下载 | Win11 官方精简版,系统占用空间极少!(12月更新、Win 11 IoT物联网 LTSC版、适合老电脑安装使用)
windows·科技·物联网·microsoft·微软·电脑
Aevget10 小时前
界面控件Telerik UI for Blazor 2025 Q3新版亮点 - 进一步提升AI集成功能
人工智能·ui·界面控件·blazor·telerik
xixixi7777712 小时前
安全SDK:无感采集用户在APP内的交互行为(点击速度、滑动轨迹、停留时长),用于后续的行为生物特征分析
安全·microsoft·数据采集·特征·隐私·合规·设备指纹
巴拉巴拉~~13 小时前
KMP 算法通用图表组件:KmpChartWidget 多维度可视化 + PMT 表渲染 + 性能对比
前端·javascript·microsoft
Wpa.wk1 天前
硬件环境配置-两台电脑进行局域网构建
物联网·microsoft·电脑·信息与通信·局域网构建
LinHenrY12271 天前
初识C语言(文件操作)
c语言·windows·microsoft
kaozhengpro1 天前
Microsoft DP-700 考試戰報|Fabric 資料工程師一次通過心得
运维·microsoft·fabric
独自归家的兔1 天前
通义千问3-VL-Plus - 界面交互(坐标改进)
数据库·microsoft·交互