使用 SignalR 动态创建多个集线器

Question

我目前正在使用 SignalR 聊天。我有一个表单，用户会将特定订单加载到表单中。场景是其他 staff members 可能会搜索该订单号，因此我只想让那些人参与聊天。目前，如果您加载网站，每个人都在一个名为 ChatHub.

的 hub 中

ChatHub.cs:

public class ChatHub: Hub {
 public void Send(string name, string message) {
  // Call the addNewMessageToPage method to update clients.
  Clients.All.addNewMessageToPage(name, message);
 }
}
}

Chat.cshtml:

@section scripts {
    <!--Script references. -->
    <!--The jQuery library is required and is referenced by default in _Layout.cshtml. -->
    <!--Reference the SignalR library. -->
    <script src="~/Scripts/jquery.signalR-2.0.3.min.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="~/signalr/hubs"></script>
    <!--SignalR script to update the chat page and send messages.-->
    <script>
        $(function () {
            // Reference the auto-generated proxy for the hub.
            var chat = $.connection.chatHub;
            // Create a function that the hub can call back to display messages.
            chat.client.addNewMessageToPage = function (name, message) {
                // Add the message to the page.
                $('#discussion').append(htmlEncode(name)
                    + ':' + htmlEncode(message) + '\n');
            };
            // Get the user name and store it to prepend to messages.

            //$('#displayname').val(prompt('Enter your name:', ''));
            // Set initial focus to message input box.
            $('#message').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // Call the Send method on the hub.
                    chat.server.send($('#displayname').val(), $('#message').val());
                    // Clear text box and reset focus for next comment.
                    $('#message').val('').focus();
                });
            });
        });
        // This optional function html-encodes messages for display in the page.
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }
    </script>
}
<script>

我尝试添加以下内容：

<script>
$(function () {
    var chat = jQuery.connection.chat;

    chat.addMessage = function (message, room) {

        if ($('#currentRoom').val() == room) {
            $('#messagesList').append(message);
        }
    };


        chat.send($('#textboxMessage').val(), $('#currentRoom').val());
        $('#textboxMessage').val("");


    $.connection.hub.start();
});
</script>

我正在尝试找到一种方法，根据用户加载订单获取多个中心或聊天室。

Answer 1

您必须与小组一起工作： https://www.asp.net/signalr/overview/guide-to-the-api/working-with-groups

Answer 2

您必须根据打开的订单id将用户分组，更改集线器并添加如下方法：

public class ChatHub: Hub {
 public void Send(string name, string message,string orderId) {
  // Call the addNewMessageToPage method to update clients.
  Clients.Group(orderId).addNewMessageToPage(name, message);
 }

public void JoinOrderGroup(string name,string orderId)
 {
     Groups.Add(Context.ConnectionId, orderId);
 }
}

然后修改您的 JavaScript 以在用户打开页面时调用 `JoinOrderGroup'。

@section scripts {
    <!--Script references. -->
    <!--The jQuery library is required and is referenced by default in _Layout.cshtml. -->
    <!--Reference the SignalR library. -->
    <script src="~/Scripts/jquery.signalR-2.0.3.min.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src="~/signalr/hubs"></script>
    <!--SignalR script to update the chat page and send messages.-->
    <script>
        $(function () {
            // Reference the auto-generated proxy for the hub.
             var orderId = '@Model.Id' //You can change this line to get the orderId from the correct place
             var chat = $.connection.chatHub;
            // Create a function that the hub can call back to display messages.
            chat.client.addNewMessageToPage = function (name, message) {
                // Add the message to the page.
                $('#discussion').append(htmlEncode(name)
                    + ':' + htmlEncode(message) + '\n');
            };
            // Get the user name and store it to prepend to messages.

            //$('#displayname').val(prompt('Enter your name:', ''));
            // Set initial focus to message input box.
            $('#message').focus();
            // Start the connection.
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // Call the Send method on the hub.
                    chat.server.send($('#displayname').val(), $('#message').val());
                    // Clear text box and reset focus for next comment.
                    $('#message').val('').focus();
                  chat.server.joinOrderGroup($('#displayname').val(),orderId);
                });
            });
        });
        // This optional function html-encodes messages for display in the page.
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }
    </script>
}
<script>

这样，当页面启动并且集线器连接时，它会发送一条消息以加入与表单中的订单相关的组，并且所有对发送消息方法的后续调用将包括订单ID和它将仅按此顺序传播给用户。

使用 SignalR 动态创建多个集线器

Creating multiple hubs dynamically using SignalR

c#

asp.net

jquery

signalr

asp.net-mvc-5