C# -Asp.Net.SignalR.Core之Hub
前言
程序员的进步是需要环境的,良好的团队环境,良好的开发环境,会让人进步的更加快速。
所以,我认为,如果一个程序员,在2019年还在用visual studio 2005开发,那么,他,大概率,不会想了解linq是个什么东西,因为他根本用不到。
就如同我,一直在纯windows环境下开发,所以就对core并不是很感兴趣。
因此,如果一直用visual studio 2013以下版本开发的话,估计他对signalr也就没什么兴趣。
因为我们都有个坏习惯,用不到的就不喜欢去学习。
引用signalr
闲话少叙,现在我们开始学习signalr。
首先,创建一个mvc项目,然后,我们打开nuget搜索signalr,如下图:
成功引用后,我们查看引用,会发现程序引用了很多dll,比如owin等等;这是因为singalr的依赖项比较多,所以,我们也引用了比较多的dll。
接着,我们会发现一个问题,我们添加引用是signalr,但实际引用进来的却是signalr.core,如下图:
signalr.core和signalr有什么区别呢?
我们上网查询一下,发现,他们的差异大致上就是下面这句话。
【asp.net core signalr 不支持自动重新连接。 如果客户端已断开连接,则用户必须显式启动新连接才能重新连接。 在 asp.net signalr 中,如果连接断开,signalr 会尝试重新连接到服务器。】
差异参考asp.net signalr 和 asp.net core signalr 之间的差异
startup
signalr引入完成了,现在我们需要配置和使用它了。
如何配置呢?很简单。添加startup文件,修改代码如下:
public class startup
{
public void configuration(iappbuilder app)
{
app.mapsignalr();
}
}
startup文件包含的功能很多,这里暂时不去详解了,我们暂时只要知道,startup文件会在网站启动时跟着一起运行就可以了。
因为网站运行时会调用startup的configuration方法,所以,我们在这里打开signalr的映射——app.mapsignalr(),即网站初始化,我们就开启了signalr的映射。
hub
signalr简单的来说,是用于一个网页即时通讯的工具,既然是即时通讯,那么肯定就是双工——双向的。
现在我们先来看下,【网页——>服务器】这个方向的通讯。
网页向服务器发送信息
首先,我们在服务器建立一个hub,用来接收网页的消息。
//这里命名尽量用小写,因为前台只认小写
[hubname("kibahub")]
public class kibahub : hub
{
// 这里函数命名虽然是大写,但前台js调用要用小写字母开头
public void send(string message)
{
var id = context.connectionid;
}
}
代码很简单,我们建立了一个类,并集成hub,然后编写了一个send方法,供页面调用。
还可以看到,我们在类上面加了一个特性,用来显示的声明这个hub在网页端的名称。
接下来,我们编写网页代码,在网页中,使用javascript来调用这个hub的send方法,代码如下:
<head>
<script src="~/scripts/jquery-3.3.1.min.js"></script>@*优先signalr引用*@
<script src="~/scripts/jquery.signalr-2.4.0.js"></script>
<script src="~/signalr/hubs"></script>@*这个是临时生成的文件,里面保存的是我们在服务器定义的hub生成的javascript代码*@
</head>
<body>
<script type='text/javascript'>
//引用自动生成的代理,kibahub是hubname注解属性
var kibahub = $.connection.kibahub;
console.log("kibahub get");
//开始连接
$.connection.hub.start().done(function () {
console.log("hub start done");
//客户端发送信息到服务器
kibahub.server.send('kiba');
console.log("send done");
});
</script>
</body>
</html>
从代码中可以看到,我们首先引用了三个js文件。
第一个没啥可说的,就是jq的文件。
第二jquery.signalr-2.4.0.js文件,是我们在引用signalr时,一起引入进来的,在scripts文件夹下,我们也直接引入即可。
第三signalr/hubs个文件大家应该很奇怪,我们项目里根本没有这个文件夹,也没有这个文件,而且这个hubs文件居然还没有后缀名。
事实上这个文件夹和文件的确是不存在的,因为,它们是在我们运行网站时,才会生成的临时文件。目前先不去管他是什么,我们只要知道,需要这个引用就可以了。
接下来,我们看下javascript代码。
在js代码里,我们通过$.connection.kibahub这样一句话就获取到了服务器的kibahub类的实例了,然后,我们只要调用它的send方法就可以了。
但是在调用之前,我们需要先连接一下服务器。所以就有了这么一句话 $.connection.hub.start()。
到此,网页向服务器发送数据已经编写完成了,下面我们运行网站,在浏览器中按下f12进入调试模式,然后选择console(控制台)来查看我们的输出内容。
如上图所示,我们的signalr成功的向服务器发出了信息。
服务器向网页发送信息
网页请求已经发送成功了,现在我们开始编写服务器向网页发送信息。
首先,我们在kibahub类的send方法里稍作修改,代码如下。
public void send(string message)
{
var id = context.connectionid;
ihubcontext context = globalhost.connectionmanager.gethubcontext<kibahub>();
context.clients.client(id).getmessage("518");
}
可以看到,我们在send方法中获取了当前连接的唯一标识connectionid,然后我们利用这个connectionid找到他对应的client客户端。
在通过client客户端调用网页中javascript定义的函数getmessage,并向他发送信息518。
这样服务端的代码就编写完成了。
但我们会发现,我们好像并没有在网页端用javascript定义过函数getmessage呀。
别着急,我们现在就去网页定义这个方法。
<script type='text/javascript'>
var kibahub = $.connection.kibahub;
$.connection.hub.start().done(function () {
console.log("hub start done");
kibahub.server.send('kiba');
console.log("send done");
});
kibahub.client.getmessage = function (message) {
console.log("getmessage:" + message);
};
</script>
如上述代码所示。我们可以看到getmessage 已经定义好了,现在我们在运行下网站。
如上图所示,服务成功的向客户端发出了信息。
----------------------------------------------------------------------------------------------------
到此asp.net.signalr.core就介绍完了。
框架代码已经传到github上了,欢迎大家下载。
github地址:https://github.com/kiba518/kibasignalr
----------------------------------------------------------------------------------------------------
注:此文章为原创,欢迎转载,请在文章页面明显位置给出此文链接!
若您觉得这篇文章还不错,请点击下方的【推荐】,非常感谢!