初识SignalR

SignalR 是一个集成的客户端与服务器库,基于浏览器的客户端和基于 ASP.NET 的服务器组件可以借助它来进行双向多步对话。 换句话说,该对话可不受限制地进行单个无状态请求/响应数据交换;它将继续,直到明确关闭。 对话通过永久连接进行,允许客户端向服务器发送多个消息,并允许服务器做出相应答复,值得注意的是,还允许服务器向客户端发送异步消息。它和AJax类 似,都是基于现有的技术。本身是一个复合体。一般情况下,SignalR会使用Javascript的长轮询( long polling),实现客户端和服务端通信。在WebSockets出现以后,SignalR也支持WebSockets通信。当然SignalR也使用 了服务端的任务并行处理技术以提高服务器的扩展性。它的目标整个 .NET Framework 平台,它也不限 Hosting 的应用程序,而且还是跨平台的开源项目。

SignalR 内的客户端库 (.NET/JavaScript) 提供了自动管理的能力,开发人员只需要直接使用 SignalR 的 Client Library 即可,同时它的 JavaScript 库可和 jQuery 完美整合,因此能直接与像 jQuery 或 Knockout.js 一起使用。

SignalR内部有两类对象:

· Persistent Connection:持久性连接,用来解决长时间连接的能力,而且还可以由客户端主动向服务器要求数据,而服务器端也不需要实现太多细节,只需要处理 PersistentConnection 内所提供的五个事件:OnConnected, OnReconnected, OnReceived, OnError 和 OnDisconnect 即可。

· Hub:信息交换器,用来解决 realtime 信息交换的功能,服务器端可以利用 URL 来注册一个或多个 Hub,只要连接到这个 Hub,就能与所有的客户端共享发送到服务器上的信息,同时服务器端可以调用客户端的脚本,不过它背后还是不离 HTTP 的标准,所以它看起来神奇,但它并没有那么神奇,只是 JavaScript 更强,强到可以用像 eval() 或是动态解释执行的方式,允许 JavaScript 能够动态的加载与执行方法调用而己。

SignalR 将整个交换信息的行为封装得非常漂亮,客户端和服务器全部都使用 JSON 来沟通,在服务器端声明的所有 hub 的信息,都会一般生成 JavaScript 输出到客户端,.NET 则是依赖 Proxy 来生成代理对象,这点就和 WCF/.NET Remoting 十分类似,而 Proxy 的内部则是将 JSON 转换成对象,以让客户端可以看到对象。

 

接下来Walkthrough一下:

1.新建一个empty web application

2.如果你装VS2010和powershell2.0后,在package manager console下输入:Install-Package SignalR后,会自动帮你下载和添加引用到您的项目

3.添加一个类作为Hub

    public class MyChat : Hub

    {

        /// <summary>

        /// Sends the specified message.

        /// </summary>

        /// <param name="message">The message.</param>

        public void Send(string message)

        {

            // Call the addMessage method on all clients         

            Clients.addMessage(message);

        }

    }

4.然后添加一个htm文件

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

    <title>dev home</title>

</head>

<body>

    <script src="../Scripts/jquery-1.7.2.js"></script>

    <script src="../Scripts/jquery.signalR-0.5.2.js"></script>

    <script src="/signalr/hubs" type="text/javascript"></script>

    <div>

        <script type="text/javascript">

            var chat;

            $(function () {

                // Created proxy            

                chat = $.connection.myChat;

                // Assign a function to be called by the server        

                chat.addMessage = onAddMessage;

                // Register a function with the button click               

                $("#broadcast").click(onBroadcast);

                // Start the connection        

                $.connection.hub.start();

            });

            function onAddMessage(message) {

                // Add the message to the list         

                $('#messages').append('<li>' + message + '</li>');

            }

            function onBroadcast() {

                // Call the chat method on the server           

                chat.send($('#message').val());

            }       

        </script>

        <input type="text" id="message" />

        <input type="button" id="broadcast" value="send" />

        <ul id="messages">

        </ul>

    </div>

</body>

</html>

你会发现<script src="/signalr/hubs" type="text/javascript"></script>并没有这个资源,别急,SingalR 会自动生成一个siganlr/hub 的桥接js。

然后你打开多个浏览器,你在一个浏览器中发送的消息,会同时在多个浏览器上出现。

 

我们可以看一下整个流程:

#broadcast 按钮按下后 ---->触发chat.send,这里的chat其实就是个代理,它调用了server端的Send方法---->Clients.addMessage(message);这里的Clients是dynamic类型的---->触发所有chat.addMessage对应的handler--onAddMessage,然后所有的客户端都能接受到广播消息。

这里要注意的是客户端和服务器段生成代理的规则,客户端首字母都需要小写,而且客户端addMessage和send都与服务器段一一对应。而且这两个方法名字不能相同。

public class Chat : Hub 
   {
       public void SendMessage(string message)
       {
           Clients.sendMessage(message);
       }
   } 

这样的话就会出问题。

 

接下去会深入研究并且继续写一些日志,请大家关注和多提意见,谢谢。

 

参考:

http://www.cnblogs.com/wintersun/archive/2012/07/19/2599020.html

http://www.cnblogs.com/shanyou/archive/2012/07/28/2613693.html

posted @ 2012-08-29 16:14  nickycookie  阅读(1327)  评论(6编辑  收藏  举报