详解在ASP.NET Core下使用SignalR技术

详解在ASP.NET Core下使用SignalR技术

什么是SignalR技术？

SignalR是一种实时通讯技术，借助它，我们可以在客户端和服务器之间建立实时且双向的通讯，使得我们能够更加容易地实现实时的推送、聊天、消息提醒等等功能。

如何使用SignalR技术？

在ASP.NET Core下，我们可以通过以下几个步骤来使用SignalR技术：

1.添加SignalR的NuGet包

我们需要在我们的项目中引入SignalR的NuGet包，可以通过Visual Studio中的NuGet管理器来进行添加，或者通过在项目的.csproj文件中添加以下代码：

<PackageReference Include="Microsoft.AspNetCore.SignalR" Version="1.1.0" />

2.添加SignalR服务

在我们的Startup.cs文件中，我们需要在ConfigureServices方法中添加以下代码来注册SignalR的服务：

public void ConfigureServices(IServiceCollection services)
{
    services.AddSignalR();
}

3.创建SignalR的Hub类

我们需要创建一个Hub类来处理客户端连接、断开连接、数据传输等等操作，可以在项目中新建一个类来继承Hub，例如：

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

在这个Hub类中，我们定义了一个名为SendMessage的方法，它用于接收客户端发来的消息，并将这个消息发送给所有的客户端。

4.客户端连接SignalR服务

我们需要在客户端代码中连接到SignalR服务，并且处理接收到的消息。假设我们的客户端是一个网页，我们可以在这个网页的JavaScript代码中添加以下代码来连接SignalR服务：

var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();

connection.on("ReceiveMessage", function (user, message) {
    // 处理接收到的消息
});

connection.start();

在这段代码中，我们使用HubConnectionBuilder来创建一个SignalR连接，这个连接的URL是/chatHub，也就是我们的Hub类的名称。然后我们通过.on来监听ReceiveMessage事件，当服务端广播ReceiveMessage事件时，这个回调函数就会被触发。

5.发送消息到SignalR服务

最后，我们需要在客户端代码中将消息发送到SignalR服务，例如：

connection.invoke("SendMessage", user, message);

这行代码会调用服务端的SendMessage方法，并且传递两个参数user和message，这个方法接收到消息之后会将这个消息广播给所有连接到服务端的客户端。

示例说明

这里提供两个在ASP.NET Core下使用SignalR技术的示例说明。

示例1：实现在线用户列表

这个示例演示了如何使用SignalR来实现一个在线用户列表的功能。我们的网站上有一个聊天室，我们需要在聊天室页面上显示当前在线的用户。以下是一个简化版的代码示例：

public class ChatHub : Hub
{
    private static Dictionary<string, string> _connectedUsers = new Dictionary<string, string>();

    public override Task OnConnectedAsync()
    {
        var username = Context.User.Identity.Name;
        _connectedUsers[username] = Context.ConnectionId;

        Clients.All.SendAsync("UserConnected", username);

        return base.OnConnectedAsync();
    }

    public override Task OnDisconnectedAsync(Exception exception)
    {
        var username = Context.User.Identity.Name;
        _connectedUsers.Remove(username);

        Clients.All.SendAsync("UserDisconnected", username);

        return base.OnDisconnectedAsync(exception);
    }

    public async Task SendMessage(string message)
    {
        var username = Context.User.Identity.Name;

        await Clients.All.SendAsync("ReceiveMessage", username, message);
    }

    public async Task<IEnumerable<string>> GetOnlineUsers()
    {
        return await Task.FromResult(_connectedUsers.Keys);
    }
}

在这个Hub类中，我们定义了一个静态的字典对象_connectedUsers，用于存储当前所有在线的用户。当用户连接到服务端时，我们会将他的用户名和连接ID存储在字典中，并且广播UserConnected事件告知所有已连接的客户端有新的用户连接到了服务端。当用户断开连接时，我们会将这个用户从字典中移除，并且广播UserDisconnected事件告知所有已连接的客户端这个用户已经离开了聊天室。当接收到客户端发送的消息时，我们会广播ReceiveMessage事件，并且将消息的发送者和消息内容作为参数传递。当客户端需要获取当前在线用户列表时，我们会通过GetOnlineUsers方法返回一个包含所有在线用户名的IEnumerable。

在客户端代码中，我们需要添加以下代码来处理在线用户列表的更新：

var connection = new signalR.HubConnectionBuilder().withUrl("/chatHub").build();

connection.on("UserConnected", function (username) {
    // 在在线用户列表中添加一个新的用户
});

connection.on("UserDisconnected", function (username) {
    // 从在线用户列表中移除一个用户
});

connection.on("ReceiveMessage", function (username, message) {
    // 处理接收到的消息
});

connection.start().then(function () {
    connection.invoke("GetOnlineUsers").then(function (users) {
        // 处理获取到的在线用户列表
    });
});

在这个客户端代码中，我们监听UserConnected和UserDisconnected事件，当有新的用户连接或者断开连接时，我们更新在线用户列表。当接收到消息时，我们调用相应的处理函数。在SignalR连接建立之后，我们通过GetOnlineUsers方法获取在线用户列表，并且处理返回的值。

示例2：实现即时股票行情

这个示例演示了如何使用SignalR来实现一个即时股票行情的功能。我们的网站上有一个实时股票行情页面，我们需要在这个页面上显示每个股票的最新价格，价格每隔1秒钟刷新一次。以下是一个简化版的代码示例：

public class StocksHub : Hub
{
    private static Dictionary<string, decimal> _stockPrices = new Dictionary<string, decimal>()
    {
        {"AAPL", 100.0m},
        {"GOOG", 200.0m},
        {"MSFT", 150.0m},
    };

    public override Task OnConnectedAsync()
    {
        return base.OnConnectedAsync();
    }

    public override Task OnDisconnectedAsync(Exception exception)
    {
        return base.OnDisconnectedAsync(exception);
    }

    public async Task<decimal> GetStockPrice(string stockSymbol)
    {
        return await Task.FromResult(_stockPrices[stockSymbol]);
    }

    public async Task UpdateStockPrices()
    {
        foreach (var stockSymbol in _stockPrices.Keys)
        {
            _stockPrices[stockSymbol] += (decimal)(new Random().NextDouble() - 0.5);

            await Clients.All.SendAsync("StockPriceUpdated", stockSymbol, _stockPrices[stockSymbol]);
        }
    }
}

在这个Hub类中，我们定义了一个静态的字典对象_stockPrices，用于存储每个股票的价格。当客户端需要获取某个股票的价格时，我们会通过GetStockPrice方法返回这个股票的价格。当服务端需要更新所有股票的价格时，我们会遍历所有的股票价格，为每个价格随机生成一个小于1的浮点数，并将这个随机数加到原价格上。然后我们用StockPriceUpdated事件广播给所有连接的客户端这个股票的最新价格。

在客户端代码中，我们需要添加以下代码来处理股票价格的更新：

var connection = new signalR.HubConnectionBuilder().withUrl("/stocksHub").build();

connection.on("StockPriceUpdated", function (stockSymbol, price) {
    // 更新股票价格的显示
});

connection.start().then(function () {
    setInterval(function () {
        connection.invoke("UpdateStockPrices");
    }, 1000);
});

在这个客户端代码中，我们监听StockPriceUpdated事件，当服务端广播股票价格更新事件时，我们更新股票价格的显示。然后我们在SignalR连接建立之后，每隔1秒钟调用一次服务端的UpdateStockPrices方法，来获取所有股票的最新价格并更新显示。