SignalR简单Demo
我们实现一个简单的消息通知的Demo
在NuGet中添加SignalR引用
install-package Microsoft.AspNet.SignalR然后我们创建一个类来引用Hub类
namespace SignalRDemo.Hubs
{
public class ServerHub:Hub
{
}
}或者直接在添加项中添加SignalR添加SignalR
然后我们在ServerHub类中创建一个发送信息方法
/// <summary>
/// 服务器发送方法
/// </summary>
/// <param name="msg"></param>
public void SendMsg(string msg)
{
//调用客户端的showMsg方法
Clients.All.showMsg(Context.ConnectionId, msg);
}这个方法由客户端进行调用，方法中Clients代表客户端对象,这段话表示调用客户端的showMsg方法.而All代表是给所有人发送通知
All：调用所有人方法
Others：调用除去自己所有人方法
Caller：调用自己方法
Group：调用组内所有人方法
Client(string connectionId)：调用指定连接编号的方法
Context.ConnectionId是当前连接用户的标志,是一个GuId
然后我们创建一个Start类来注册SignalR
namespace SignalRDemo
{
public class Startup
{
public void Configuration(IAppBuilder app)
{
app.MapSignalR();
}
}
}注意，此处是一个约定，类名与方法名必须为Startup和Configuration。该类还必须在网站根目录，否则运行时就会出错
接下来我们就可以创建页面了
创建一个Home控制器Index页面。
在页面中引用JQuery类库与SignalR类库
然后我们再手动添加一个类库引用
<script src="~/SignalR/Hubs"></script>
这个js类库在目录下是找不到的,它是在运行时自动创建
我们可以启动项目来查看下这个路径
如果出现此页面则表示我们SignalR配置OK。
下面我们就可以写客户端了
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
</head>
<body>
<div>
<input type="text" id="msg"/>
<button id="sendMsg">发送消息</button>
</div>
<ol id="showMsg">
</ol>
<script src="~/Scripts/jquery-1.6.4.js"></script>
<script src="~/Scripts/jquery.signalR-2.2.2.js"></script>
<script src="~/SignalR/Hubs"></script>
<script>
$(function () {
//获取服务端连接对象
var hub = $.connection.serverHub;
//创建服务端所调用的客户端方法
hub.client.showMsg=function(name, msg){
$('#showMsg').append('<li><span style="color:red">'+name+':</span>'+msg+'</li>')
}
//开始连接服务器
$.connection.hub.start().done(function () {
//连接成功
$('#sendMsg').bind('click', function () {
//调用服务端发送方法
hub.server.sendMsg($('#msg').val());
})
}).fail(function () {
//连接失败
alert("连接失败");
});
})
</script>
</body>
</html>然后就可以简单进行消息通知了
本文参与 腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。
原始发表：2017-12-21 ，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读
腾讯云开发者
