ASP .NET SignalR起步
程序员文章站
2022-04-08 17:45:41
在网站开发中,时常需要使用消息推送功能,http协议是无状态连接,我们需要一个类似桌面程序中socket保持服务器和客户端连接的技术。signalr就是这样一个技术,他能保持网站页面和服务器的一个长连接,时刻监听服务器端的信息。实现一个简单的signalr功能步骤如下。 1.新建一个.net项目,使 ......
在网站开发中,时常需要使用消息推送功能,http协议是无状态连接,我们需要一个类似桌面程序中socket保持服务器和客户端连接的技术。signalr就是这样一个技术,他能保持网站页面和服务器的一个长连接,时刻监听服务器端的信息。实现一个简单的signalr功能步骤如下。
1.新建一个.net项目,使用nuget引用signalr。会在script文件下生成jquery.signalr-2.2.0.js文件。
2.添加startup类,注册signalr。
1 using microsoft.owin; 2 using owin; 3 4 [assembly: owinstartup(typeof(vipsignalr.startup))] 5 6 namespace vipsignalr 7 { 8 public class startup 9 { 10 public void configuration(iappbuilder app) 11 { 12 app.mapsignalr(); 13 } 14 } 15 }
3.添加集线器类chathub.cs
using microsoft.aspnet.signalr; namespace vipsignalr { public class chathub : hub { public void send(string name, string message) { clients.all.receivemessage(name, message); } } }
4.添加前台消息发送和接受的代码
(1)新建一个页面。
(2)添加html。
your name: <input type="text" id="nametxt"/><br /> message: <input type="text" id="messagetxt" /><br /> <input type="button" id="sendbtn" value="发送" /><br /> 消息记录:<br/> <div id="msgdiv"></div>
(3)引用js文件。
<script src="~/scripts/jquery-1.6.4.js"></script> <script src="~/scripts/jquery.signalr-2.2.0.js"></script> <script src="~/signalr/hubs"></script>
其中/signalr/hubs是通过chathubs.cs生成的js文件,可在浏览器resource查看。我们通过这个js文件使用在chathubs.cs中定义的方法。
(4)使用signalr。
<script> $(function () { // 引用自动生成的集线器代理 //名称和hub类相同,首字母小写 var chat = $.connection.chathub; //接受消息,方法名称和参数和hub类中动态解析方法名相同 chat.client.receivemessage = function (name, message) { var msg = "<div>" + name + ": " + message + "</div>"; $("#msgdiv").append(msg); } // 集成器连接开始 $.connection.hub.start().done(function () { $('#sendbtn').click(function () { //发送消息,方法名和参数和hub类对应,首字母小写 chat.server.send($("#nametxt").val(), $('#messagetxt').val()); }); }); }); </script>
5.运行。通过两个浏览器来测试,可达到如下效果。