使用SignalR從服務端主動推送警報日志到各種終端（桌面、移動、網頁）
閱讀導航
- 本文背景
- 代碼實現
- 本文參考
1.本文背景
工作上有個業務，.Net Core WebAPI作為服務端，需要將運行過程中產生的日志分類，並實時推送到各種終端進行報警，終端有桌面(WPF)、移動(Xamarin.Forms)、網站(Angular.JS)等，使用SignalR進行警報日志推送。
下面是桌面端的測試效果：
2.代碼實現
整個系統由服務端、桌面端、網站、移動端組成，結構如下：
2.1 服務端與客戶端都使用的日志實體類
簡單的日志定義，服務端會主動將最新日志通過AlarmLogItem實例推送到各個終端：
/// <summary>
/// 報警日志
/// </summary>
public class AlarmLogItem
{
public string Id { get; set; }
/// <summary>
/// 日志類型
/// </summary>
public AlarmLogType Type { get; set; }
/// <summary>
/// 日志名稱
/// </summary>
public string Text { get; set; }
/// <summary>
/// 日志詳細信息
/// </summary>
public string Description { get; set; }
/// <summary>
/// 日志更新時間
/// </summary>
public string UpdateTime { get; set; }
}
public enum AlarmLogType
{
Info,
Warn,
Error
}
2.2 服務端
使用 .Net Core 2.2 搭建的Web API項目
2.2.1 集線器類AlarmLogHub.cs
定義集線器Hub類AlarmLogHub，繼承自Hub，用於SignalR通信，看下面的代碼，沒加任何方法，您沒看錯：
public class AlarmLogHub : Hub
{}
2.2.2 Startup.cs
需要在此類中注冊SignalR管道及服務，在下面兩個關鍵方法中用到，B/S后端的朋友非常熟悉了。
- ConfigureServices方法
添加SignalR管道（是這個說法吧？）：
services.AddSignalR(options => { options.EnableDetailedErrors = true; });
- Configure方法注冊SignalR服務地址
端口用的8022，客戶端訪問地址是：http://localhost:8022/alarmlog
app.UseSignalR(routes =>
{
routes.MapHub<AlarmLogHub>("/alarmlog");
});
2.2.3 SignalRTimedHostedService.cs
這是個關鍵類，用於服務端主動推送日志使用，Baidu、Google好久才找到，站長技術棧以C/S為主，B/S做的不多，沒人指點，心酸，參考網址：How do I push data from hub to client every second using SignalR
。
該類繼承自IHostedService，作為服務自啟動（亂說的），通過SignalRTimedHostedService 的構造函數依賴注入得到IHubContext<AlarmLogHub>的實例，用於服務端向各客戶端推送日志使用（在StartAsync方法中開啟定時器，模擬服務端主動推送警報日志，見 DoWork 方法）：
internal class SignalRTimedHostedService : IHostedService, IDisposable
{
private readonly IHubContext<AlarmLogHub> _hub;
private Timer _timer;
//模擬發送報警日志
List<AlarmLogItem> lstLogs = new List<AlarmLogItem> {
new AlarmLogItem{ Type=AlarmLogType.Error,Text="OK WebSocket斷連",Description="嘗試連接50次，未成功重連！"},
new AlarmLogItem{ Type=AlarmLogType.Warn,Text="OK WebSocket斷開重連",Description="嘗試連接5次，成功重連！"},
new AlarmLogItem{ Type=AlarmLogType.Warn,Text="OK Restfull斷連",Description="嘗試連接30次，成功重連！"},
new AlarmLogItem{ Type=AlarmLogType.Error,Text="OK WebSocket斷連",Description="第一次斷開鏈接！"},
new AlarmLogItem{ Type=AlarmLogType.Info,Text="OK WebSocket連接成功",Description="首次成功連接！"},
new AlarmLogItem{ Type=AlarmLogType.Error,Text="OK WebSocket斷連",Description="嘗試連接第7次，未成功重連！"}
};
Random rd = new Random(DateTime.Now.Millisecond);
public SignalRTimedHostedService(IHubContext<AlarmLogHub> hub)
{
_hub = hub;
}
public Task StartAsync(CancellationToken cancellationToken)
{
_timer = new Timer(DoWork, null, TimeSpan.Zero,
TimeSpan.FromSeconds(1));
return Task.CompletedTask;
}
private void DoWork(object state)
{
if (DateTime.Now.Second % rd.Next(1, 3) == 0)
{
AlarmLogItem log = lstLogs[rd.Next(lstLogs.Count)];
log.UpdateTime = DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss.fff");
_hub.Clients.All.SendAsync("ReceiveAlarmLog", log);
}
}
public Task StopAsync(CancellationToken cancellationToken)
{
_timer?.Change(Timeout.Infinite, 0);
return Task.CompletedTask;
}
public void Dispose()
{
_timer?.Dispose();
}
}
SignalRTimedHostedService 類作為Host服務(繼承自 IHostedService)，需要在Startup.cs的ConfigureServices方法中注冊管道(是吧？各位有沒有B/S比較好的書籍推薦，站長打算有空好好學學)：
services.AddHostedService<SignalRTimedHostedService>();
服務端關鍵代碼已經全部奉上，下面主要說說桌面端和移動端代碼，其實兩者代碼類似。
2.3 網站
參考 index.html
2.4 桌面端(WPF)
使用 .Net Core 3.0創建的WFP工程，需要引入Nuget包：Microsoft.AspNetCore.SignalR.Client
界面用一個ListView展示收到的日志：
<Grid>
<ListBox x:Name="messagesList" RenderTransformOrigin="-0.304,0.109" BorderThickness="1" BorderBrush="Gainsboro"/>
</Grid>
后台寫的簡陋，直接在窗體構造函數中連接服務端SignalR地址：http://localhost:8022/alarmlog， 監聽服務端警報日志推送：ReceiveAlarmLog。
using AppClient.Models;
using Microsoft.AspNetCore.SignalR.Client;
using System;
using System.Threading.Tasks;
using System.Windows;
namespace SignalRChatClientCore
{
/// <summary>
/// Interaction logic for MainWindow.xaml
/// </summary>
public partial class MainWindow : Window
{
HubConnection connection;
public MainWindow()
{
InitializeComponent();
connection = new HubConnectionBuilder()
.WithUrl("http://localhost:8022/alarmlog")
.Build();
connection.Closed += async (error) =>
{
await Task.Delay(new Random().Next(0, 5) * 1000);
await connection.StartAsync();
};
connection.On<AlarmLogItem>("ReceiveAlarmLog", (message) =>
{
this.Dispatcher.Invoke(() =>
{
messagesList.Items.Add(message.Description);
});
});
try
{
connection.StartAsync();
messagesList.Items.Add("Connection started");
}
catch (Exception ex)
{
messagesList.Items.Add(ex.Message);
}
}
}
}
2.4 移動端
移動端其實和桌面端類似，因為桌面端使用的 .Net Core 3.0，移動端使用的 .NET Standard 2.0，都需要引入Nuget包：Microsoft.AspNetCore.SignalR.Client。
界面使用ListView展示日志，這就不貼代碼了，使用的MVVM方式，直接貼ViewModel代碼吧，大家只看個大概，不要糾結具體代碼，參照桌面.cs代碼，是不是一樣的？
using AppClient.Models;
using AppClient.Views;
using Microsoft.AspNetCore.SignalR.Client;
using System;
using System.Collections.ObjectModel;
using System.Diagnostics;
using System.Threading.Tasks;
using Xamarin.Forms;
using System.Linq;
namespace AppClient.ViewModels
{
/// <summary>
/// 報警日志VM
/// </summary>
public class AlarmItemsViewModel : BaseViewModel
{
private ViewState _state = ViewState.Disconnected;
/// <summary>
/// 報警日志列表
/// </summary>
public ObservableCollection<AlarmLogItem> AlarmItems { get; set; }
public Command LoadItemsCommand { get; set; }
//連接報警服務端
private HubConnection _connection;
public AlarmItemsViewModel()
{
Title = "報警日志";
AlarmItems = new ObservableCollection<AlarmLogItem>();
LoadItemsCommand = new Command(async () => await ExecuteLoadItemsCommand());
//收到登錄成功通知
MessagingCenter.Subscribe<LoginViewModel, LoginUser>(this, "LoginSuccess", async (sender, userInfo) =>
{
//DisplayAlert("登錄成功", userInfo.UserName, "確定");
});
MessagingCenter.Subscribe<NewItemPage, AlarmLogItem>(this, "添加項", async (obj, item) =>
{
var newItem = item as AlarmLogItem;
AlarmItems.Add(newItem);
await DataStore.AddItemAsync(newItem);
});
ConnectAlarmServer();
}
async Task ExecuteLoadItemsCommand()
{
if (IsBusy)
return;
IsBusy = true;
try
{
AlarmItems.Clear();
var items = await DataStore.GetItemsAsync(true);
foreach (var item in items)
{
AlarmItems.Add(item);
}
}
catch (Exception ex)
{
Debug.WriteLine(ex);
}
finally
{
IsBusy = false;
}
}
private async Task ConnectAlarmServer()
{
if (_state == ViewState.Connected)
{
try
{
await _connection.StopAsync();
}
catch (Exception ex)
{
return;
}
_state = ViewState.Disconnected;
}
else
{
try
{
_connection = new HubConnectionBuilder()
.WithUrl(App.Setting.AlarmHost)
.Build();
_connection.On<AlarmLogItem>("ReceiveAlarmLog", async (newItem) =>
{
AlarmItems.Add(newItem);
await DataStore.AddItemAsync(newItem);
});
_connection.Closed += async (error) =>
{
await Task.Delay(new Random().Next(0, 5) * 1000);
await _connection.StartAsync();
};
await _connection.StartAsync();
}
catch (Exception ex)
{
return;
}
_state = ViewState.Connected;
}
}
private enum ViewState
{
Disconnected,
Connecting,
Connected,
Disconnecting
}
}
}
關鍵代碼已經貼完了，希望對大家能有所幫助。
3.參考
- .NET 客戶端 SignalR ASP.NET Core
- SignalR-samples
- How do I push data from hub to client every second using SignalR
除非注明，文章均由 Dotnet9 整理發布，歡迎轉載。
轉載請注明本文地址：https://dotnet9.com/6913.html
歡迎掃描下方二維碼關注 Dotnet9 的微信公眾號，本站會及時推送最新技術文章
