快捷導航

.Net?core?Blazor+自定義日志提供器實現(xiàn)實時日志查看器的原理解析

更新時間：2022年10月30日 15:53:23 作者：變形精怪

我們經(jīng)常遠程連接服務(wù)器去查看日志，比較麻煩，如果直接訪問項目的某個頁面就能實時查看日志就比較奈斯了，結(jié)合blazor實現(xiàn)了基本效果，這篇文章主要介紹了.Net?core?Blazor+自定義日志提供器實現(xiàn)實時日志查看器,需要的朋友可以參考下

場景

我們經(jīng)常遠程連接服務(wù)器去查看日志，比較麻煩，如果直接訪問項目的某個頁面就能實時查看日志就比較奈斯了，花了1天研究了下.net core 日志的原理，結(jié)合blazor實現(xiàn)了基本效果。

實現(xiàn)原理

自定義日志提供器，將日志記錄到內(nèi)存中，滾動10W條刪除。
提供blazor組件，實時從內(nèi)存中讀取后顯示，搞了個簡單的條件搜索。

為毛用內(nèi)存存儲？因為快，主要目的是實時監(jiān)控，方便調(diào)試，只需要最近一段時間的數(shù)據(jù)，所以內(nèi)存是最合適的。

由于數(shù)據(jù)是存儲在全局靜態(tài)變量中的（線程安全的），所以多個人同時打開頁面查看日志其實看的是同一份數(shù)據(jù)。

這個庫默認提供了與.net core默認的日志框架的繼承，但你也可以用自己的方式把數(shù)據(jù)存儲到那個靜態(tài)變量中。

如何使用？

必須是asp.net 6.x的項目，至于是mvc webapi razorpages還是blazor無所謂，都可以簡單配置支持blazor server，assembly模式按沒考慮過。

我的項目是webapi，啟用blazor server有影響嗎？完全木有，asp.net core本就是基礎(chǔ)web框架，同一個項目可以同時支持webapi mvc razorpage和blazor的。

1、啟用blazor server（若你本來是，直接跳過）

若你不熟悉如何在現(xiàn)有項目集成blazor server，可以建個空的blazor server項目，然后按下面的步驟操作

在startup.cs或program.cs中

//注冊服務(wù)
services.AddRazorPages();
services.AddServerSideBlazor();

//配置路由
app.UseEndpoints(endpoints =>
{
　　endpoints.MapDefaultControllerRoute();
　　endpoints.MapBlazorHub();
　　endpoints.MapFallbackToPage("/_Host");
});

然后將你新建的空的blazor server項目中的如下文件和目錄拷貝過來

wwwroot：里面包含默認樣式，若你完全決定自己搞樣式，可以不拷貝
Pages：里面包含blazor server中基礎(chǔ)的頁面，其中_Host.cshtml（用來放blazor server根組件的）、_Layout.cshtml（_Host.cshtml依賴這個布局，我們還會在里面放公用的css js引用）文件必拷
Shared、公共組件，比如blazor的布局、菜單等組件
_Imports.razor、為所有blazor組件做全局命名空間導入的，注意它只為blazor組件服務(wù)，并不是global using，這個是給整個項目用的
App.razor ，blazor server的根組件，它被放在_Host.cshtml中的。在此頁面頂部：<Router AppAssembly="@typeof(App).Assembly" AdditionalAssemblies="new Assembly[]{ typeof(BlazorServerLogger).Assembly}">

注意修改命名空間，尤其注意_Layout.cshtml head部分<link href="ZLJ.FYJIOT.ApiHost.styles.css" rel="stylesheet" />前面的命名空間替換為你當前項目的命名空間，這個是當前項目中的組件的樣式文件，自動生成的

2、安裝咱的日志包：BXJG.BlazorServerLogger3、配置

在program.cs中

public static IHostBuilder CreateHostBuilder(string[] args) =>
            Host.CreateDefaultBuilder(args)
                .ConfigureLogging(b=>b.AddBlazorServerLogger())

現(xiàn)在啟動，導航到 /log-blazor 頁面看效果。

自定義配置和樣式

目前做的比較簡單，默認滾動刪除10W條、記錄所有類別和級別的日志、以及組件的樣式都是固定的，有興趣可以自己改。

默認為你建好了頁面 /log-blazor，這要求你在App.razor中配置AdditionalAssemblies="new Assembly[]{ typeof(BlazorServerLogger).Assembly}"，如果你不想要這個頁面，可以自己建頁面，然后引入BlazorServerLogger組件，升值你也可以直接讀取BlazorServerLoggerExt.MsgContainer中的當前日志信息，自己做顯示。