我是SignalR的新手,我正在尝试使用带有ASP.NET MVC 3的signalR开发简单的聊天应用程序。我已经使用Tutorial: Getting Started with SignalR (C#)引用进行了以下编码。
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类
public class ChatUser
{
public string ClientId { get; set; }
public string Name { get; set; }
}
IndexView.chtml
SignalR聊天
<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>
但是当我试图调用Logon
的{{1}}方法时,我正在关注:
未捕获TypeError:对象#没有方法'登录'
任何人在使用SignalR进行上述编码时都会帮助我。
答案 0 :(得分:2)
当使用带有SignalR的JavaScript与服务器方法通信时,服务器方法被引用为Camel Cased,除非通过HubMethodName
属性指定。
如果您想继续使用当前代码,可以通过两种方式修复它。
在服务器端,Hub将[HubMethodName("foo")]
放在每个上方
方法名称正确的方法。所以登录将是:
[HubMethodName("Logon")]
public void Logon(string clientName)
{
...
}
:
chat.server.logon(...);
请记住,您必须将这些方法中的任何一种应用于所有方法(通过#1)或所有与服务器的通信(通过#2)。
希望这有帮助!