在Blazor Server应用程序中使用SignalR Core代替socket.io

Blazor Server应用程序可以使用SignalR Core来实现与服务器的实时通信，而无需使用第三方JavaScript库。以下是在Blazor Server应用程序中使用SignalR Core的示例代码：

1.在Startup.cs文件中，将SignalR服务配置为使用JSON作为默认协议。

public void ConfigureServices(IServiceCollection services)
{
    //Configure SignalR
    services.AddSignalR().AddJsonProtocol(options => {
        options.PayloadSerializerOptions.PropertyNamingPolicy = null;
    });
}

2.添加SignalR集线器类并实现所需的方法，例如：

public class ChatHub : Hub
{
    public async Task SendMessage(string user, string message)
    {
        await Clients.All.SendAsync("ReceiveMessage", user, message);
    }
}

3.将SignalR集线器路由到Blazor Server应用程序，例如：

app.UseEndpoints(endpoints =>
{
    endpoints.MapHub("/chatHub");
    endpoints.MapFallbackToFile("index.html");
});

4.在Blazor组件中，使用注入ISignalRHubContext服务来初始化SignalR连接，并向服务器发送和接收消息。

@page "/chat"
@using Microsoft.AspNetCore.SignalR.Client
@inject IJSRuntime jsRuntime
@inject NavigationManager navigationManager
@inject ISignalRHubContext hubContext

Blazor Chat











Send


    @foreach (var msg in messages)
    {
        
@msg
    }


@code {
    private string user;
    private string message;
    private List messages = new List();
    private HubConnection hubConnection;

    protected override async Task OnInitializedAsync()
    {
        hubConnection = hubContext.CreateConnection();
        await hubConnection.StartAsync();
        hubConnection.On("ReceiveMessage", (user, message) =>
        {
            messages.Add($"{user}: {message}");
            StateHasChanged();
        });
    }

    private async Task SendMessage()
    {
        await hubConnection.SendAsync("SendMessage", user, message);
        message = "";
    }
}

这种方法可以轻松地使用SignalR Core来替换socket.io