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

Question

我目前正在使用SignalR聊天。我有一个表单，用户将把特定的订单加载到表单中。情况是其他人staff members可能会搜索该订单号，因此我只希望这些人参与聊天。目前，如果您加载该网站，每个人都在一个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);
 }
}
}

聊天.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

您必须根据打开的订单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，并将其传播到仅按此顺序的用户。