如何在SignalR上获取已连接客户端的列表 [英] How to get a list of connected clients on SignalR

查看:715
本文介绍了如何在SignalR上获取已连接客户端的列表的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我是SignalR的新手。
我的第一个任务是制作一个简单的聊天应用程序。

I am quite new to SignalR. My first assignment is to make simple chat app.

我一直在浏览和阅读,最后做了一个页面,你来聊天,它工作正常。

I have been browsing and reading and finally made a page where you come and chat and it works fine.

现在我需要显示已连接客户端的列表。为此,我编写了以下代码。
这是我的HUB。

Now I need to show a list of connected clients. To achieve this I have wrote the following code. This is my HUB.

public class ChatHub: Hub
{

    chatEntities dc = new chatEntities();
    public void Send(string message,string clientName)
    {
        Clients.addMessage(message,clientName);

    }

    // I want to save the user into my database, when they join 
    public void Joined(string userId,string userName)
    {

        CurrentChattingUsers cu = new CurrentChattingUsers();
        cu.ConnectionId = userId;
        cu.UserName = userName;

        dc.CurrentChattingUsers.AddObject(cu);
        dc.SaveChanges();


       Clients.joins(userId, userName);
    }

    // This will return a list of connected user from my db table.
    public List<ClientModel> GetConnectedUsers()
    {
        var query = (from k in dc.CurrentChattingUsers
                     select new ClientModel()
                     {
                         FullName = k.UserName,
                         UserId = k.ConnectionId
                     }).ToList();
        return query;
    }   


}

这就是它...怎么办??
我是否朝着正确的方向前进?如果,那么我是如何从视图中调用此方法的呢?
一些好的建议真的会帮助我。
欢呼

And thats it...Now what?? Am I going to the right direction? If, I am then how to call this methods from the view? Some good suggestions will really help me out. cheers

编辑:

我添加了以下脚本集线器启动时

I have added the following script when the hub start

$.connection.hub.start(function () {
            chat.getConnectedUsers();

        });

这是在我的Hub中返回客户名称的方法

This is the method that returns the client names in my Hub

  public List<ClientModel> GetConnectedUsers()
    {
        var data = (from k in dc.Users
                     select new ClientModel()
                     {
                         FullName = k.UserName

                     }).ToList();

         Clients.loadUsers(data);
        return data;
    }

在firebug我可以看到它返回如下内容;

in firebug i can see it returns something as follows;

{"State":{},"Result":[{"FullName":"mokarom","UserId":null},  {"FullName":"aka8000","UserId":null},{"FullName":"johnnyno5","UserId":null},{"FullName":"reza","UserId":null},{"FullName":"amyo","UserId":null},{"FullName":"rezatech","UserId":null}],"Id":"0","Error":null,"StackTrace":null}

但是,我如何在我的视图中显示?

But, how would I display that in my view??

编辑:

这是目前为止的完整视图

this the complete view so far

<script type="text/javascript">
    var chat;
    var myClientName
    $(document).ready(function(){

      myClientName = '@Request.Cookies["ChatterName"].Value';


        // Created proxy
        chat = $.connection.chatHub;
        // Assign a function to be called by the server
        chat.addMessage = onAddMessage;

        // Register a function with the button click
        $("#broadcast").click(onBroadcast);


        $('#message').keydown(function (e) {
            if (e.which == 13) { //Enter
                e.preventDefault();

                onBroadcast();

            }
        });

        // Start the connection
        $.connection.hub.start(function () {
           chat.getConnectedUsers();

        });

        chat.loadUsers = function (data) {
            loadUsers(data); 

         };
    });


    function onAddMessage(message,clientName) {
        // Add the message to the list
        $('#messages').append('<div class="chatterName">' + clientName + ' </div><div class="chatterMessage"> ' + message + '</div><div class="clear">');

    }
    function onBroadcast() {
        // Call the chat method on the server
        chat.send($('#message').val(), myClientName);
        $('#message').val('');
    }
    function loadUsers(data) {
        $('#clientList').html(data.Result[0].FullName);

    }
</script>

问题:这里看不到任何内容:$('#clientList')。html(数据。结果[0] .FullName);
firebug说数据未定义

Problem: don't see anything here: $('#clientList').html(data.Result[0].FullName); firebug says 'data is not defined'

推荐答案

JavaScript

var chats = $.connection.chatHub;
chats.loadUsers = function (data) { loadUsers(data); };
var connectedUserCount = 0;

$.connection.hub.start(function () 
         { chats.getConnectedUsers(); });

function loadUsers =  = function (data) {
  console.log(data); //so you can see your data in firebug.etc
            //which signal r will have converted to json so you could try
  var numberOfUsers = data.length;  
}

启动集线器后,聊天室的所有公共功能都可以作为javascript函数。这是信号器/集线器使用客户端和服务器之间的最佳可用连接方法创建的。

Once hub is started chats would have all the public functions of your hub available as javascript functions. This is what the signalr/hubs creates using the best available connection method between client and server.

反过来,您的C#中心可以访问您设置的任何javascripts函数,例如

In reverse your C# hub will have access to any javascripts functions you setup, e.g.

Clients.loadUsers(query);  
//add this to you server side just before you return query

ps - 您可能也可以考虑使用 OnConnectedAsync ,当然你可能仍然坚持这些。我也在等待使用sql的web农场支持的完全支持,这是在管道中。

ps - you might also consider using OnConnectedAsync, though of course you might still persist these. I'm also waiting for full support for web farm support using sql, which is in the pipeline.

这篇关于如何在SignalR上获取已连接客户端的列表的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆