• 初识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

  • 相关阅读:
    CSS 浮动
    函数defined
    SVN提交冲突
    抽象方法和抽象类
    Teco测试总结
    面向对象三大特性(封装,继承,多态)之多态
    PHP工厂模式的简单实现
    DOM 访问节点
    c程序的执行过程
    PHP实现菱形与杨辉三角形【php趣味案例】
  • 原文地址:https://www.cnblogs.com/cqcmdwym/p/2662215.html
Copyright © 2020-2023  润新知