3

I am new in SignalR and I am trying to develop simple chat application using signalR with ASP.NET MVC 3. I have done following coding with Tutorial: Getting Started with SignalR (C#) reference.

ChatHub

public class ChatHub : Hub
{
    private static readonly Dictionary<string, ChatUser> _users 
        = new Dictionary<string, ChatUser>(StringComparer.OrdinalIgnoreCase);

    public Task Send(string message)
    {
        var user = _users.Values.FirstOrDefault(u => u.ClientId == Context.ConnectionId);

        if (user == null)
        {
            throw new Exception("User is not logged in");
        }

         return Clients.All.message(user.Name, message, TimeStamp());
    }

    public void Logon(string clientName)
    {
        if (clientName.Length > 10)
        {
            throw new Exception("I prefer short names.");
        }

        if (_users.Any(x => x.Key == clientName))
        {
            throw new Exception("User name is already taken, please select a different one.");
        }

        _users.Add(clientName, new ChatUser { ClientId = Context.ConnectionId, Name = clientName });

        Clients.Caller.name = clientName;

        Clients.All.loggedOn(clientName, TimeStamp());
    }

    public Task Logout()
    {
        var user = _users.Values.FirstOrDefault(u => u.ClientId == Context.ConnectionId);

        if (user != null)
        {
            _users.Remove(user.Name);
           return  Clients.All.loggedOff(user.Name, TimeStamp());
        }

        return null;
    }



    public IEnumerable<ChatUser> GetUsers()
    {
        return _users.Values.OrderBy(x => x.Name);
    }

    private static string TimeStamp()
    {
        return DateTime.Now.ToShortTimeString();
    }
}

ChatUser Class

public class ChatUser
{
    public string ClientId { get; set; }
    public string Name { get; set; }
}

IndexView.chtml

SignalR Chat

        <div id="info" class="round">
            <h1>
                SignalR Chat</h1>
            <form id="startform">
             Enter your name:
            <input type="text" id="name" />
            <input type="button" id="btn_login" class="button" style="margin-top: 25px;" value="Start chatting" />
            </form>
            <div id="login_error" style="margin-top: 100px;" class="error">
            </div>
        </div>

        <div id="chat">
            <div style="height: 50px;">
                <div>SignalRChat</div>
                <div id="logout">
                    <a href="" id="btn_logout">Logout</a>
                </div>
            </div>
            <div class="users-box right round2">
                <strong>Users in chat:</strong>
                <ul id="users">
                </ul>
            </div>
            <div class="chat-box round2">
                <div id="messages">
                    <ul id="message-list">
                    </ul>
                </div>
                <form id="chatform">
                <table width="100%">
                    <tr>
                        <td>
                            <input type="text" id="msg" />
                        </td>
                        <td align="right" width="100px">
                            <input type="button" id="btn_send" class="button" value="Send" />
                        </td>
                    </tr>
                </table>
                </form>
            </div>
        </div>
    </div>
</div>


 <!--Add script to update the page and send messages.--> 
<script type="text/javascript">
    $(function () {
         var onlineUsers = null;
        var userList = [];
        var chat = $.connection.chatHub;

        var getUsers = function () {
            chat.server.getUsers().done(function (users) {
                onlineUsers = users;
                updateUserList();
            });
        };

        var updateUserList = function () {
            $('#users li').remove();
            userList = [];

            $.each(onlineUsers, function () {
                var listItem = $('<li>{0}</li>'.format(this.Name));
                $('#users').append(listItem);

                userList[this.Name] = User(this.Name, listItem);
            });
        };

        var send = function () {
            if ($('#msg').val() !== '') {
                chat.server.Send($('#msg').val());
                $("#msg").val('');
            }
        };

        var login = function () {
            if ($('#name').val() !== '') {
                clientName = $('#name').val();

                chat.server.Logon(clientName, function () {
                    $("#info").toggle();
                    $("#chat").toggle();
                    $('#msg').focus();
                    getUsers();
                }).fail(function (e) {
                    $('#login_error').html(e);
                });
            }
        };

        var logout = function () {
            chat.server.Logout();
        }

        // Callbacks from server
        chat.client.message = function (user, msg, time) {
            $('#message-list').append('<li class="message">{0} {1}: {2}</li>'.format(time, user, msg));
            $("#messages").prop({ scrollTop: $("#messages").prop("scrollHeight") });
        };

        chat.client.loggedOn = function (user, time) {
            $('#message-list').append('<li class="info">{0} {1} logged on</li>'.format(time, user));
            getUsers();
        };

        chat.client.loggedOff = function (user, time) {
            $('#message-list').append('<li class="info">{0} {1} logged off</li>'.format(time, user));
            getUsers();
        };

        chat.client.userTyping = function (user) {
            userList[user].typing();
        };

        // Form events
        $("#btn_send").click(function () { send(); $('#msg').focus(); });
        $("#btn_login").click(function () { login(); });
        $("#btn_logout").click(function () { logout(); });
        $('#chatform').submit(function () { send(); return false; });
        $('#startform').submit(function () { login(); return false; });


        // Logout when user closes browser
        window.onbeforeunload = function () { chat.server.Logout(); };

        // Start chat
        $.connection.hub.start().done(function () {
            alert("Connected");
        });

        $("#chat").toggle();
        $('#name').focus();

    });

</script>

But I am getting following when I am trying to call Logon method of ChatHub:

Uncaught TypeError: Object # has no method 'Logon'

Anyone help me where I am wrong in above coding with SignalR.


Just a suggestion, if you are migrating, then why not use the IOUtils from libraries like apache commons etc which actually take care of managing your streams and also save you with lot of errorneous conditions

4

1 に答える 1

2

SignalR を使用して JavaScript を介してサーバー メソッドと通信する場合、HubMethodName属性で指定されていない限り、サーバー メソッドは Camel Cased として参照されます。

現在のコードを引き続き使用したい場合は、2 つの方法で修正できます。

  1. サーバー側のハブでは[HubMethodName("foo")]、各メソッドの上に正しい名前を付けます。したがって、ログオンは次のようになります。

    [HubMethodName("Logon")] public void Logon(string clientName) { ... }

  2. あなたができるJavaScriptスクリプトで:

    chat.server.logon(...);

これらのアプローチのいずれかをすべてのメソッド (#1 経由) に適用するか、サーバーへのすべての通信 (#2 経由) に適用する必要があることに注意してください。

お役に立てれば!

于 2012-12-19T17:50:39.590 に答える