zoukankan      html  css  js  c++  java
  • SignalR示例demo

    本demo是通过mvc 实现

    (1)首先在App_Start下添加Startup.cs文件定义管线的启动:

    using Microsoft.Owin;
    using Owin;
    
    [assembly: OwinStartup(typeof(SignalRTest.App_Start.Startup))]
    
    namespace SignalRTest.App_Start
    {
        public class Startup
        {
            public void Configuration(IAppBuilder app)
            {
                // 有关如何配置应用程序的详细信息,请访问 https://go.microsoft.com/fwlink/?LinkID=316888
                //app.MapSignalR<MyConnection>("echo/{*operation}");
                app.MapSignalR();
            }
        }
    }

    (2)定义Hub的客户端中包括的方法

        public interface IPlatHubClient
        {
            void ReceiveMsg(string message);//定义前台客户端上注册的方法
        }

    (3)实现Hub服务器端

    首先定义Hub的注册绑定类,该类可以实现hub的clientid与sessionID、userid的绑定(按需修改使用)

        public class PlatHubRegisteInfo
        {
            public string Id { get; set; }
            public string SessionId { get; set; }
            public string UserId { get; set; }
        }
    PlatHub实现接口如下:(这是真正的通信管线,直接放到项目中即可,无需其他地方注册)
    [HubName("PlatHub")]
        public class PlatHub : Hub<IPlatHubClient>
        {
            private static readonly object ClientMapLock = new object();
            public static readonly Dictionary<PlatHubRegisteInfo, string> ClientMap = new Dictionary<PlatHubRegisteInfo, string>();
            /// <summary>
            /// 客户端注册连接信息
            /// </summary>
            /// <param name="id"></param>
            [HubMethodName("Registe")]
            public void Registe(string id)
            {
                lock (ClientMapLock)
                {
                    ClientMap.Add(new PlatHubRegisteInfo { Id = id }, this.Context.ConnectionId);
                }
                Log.Write("", "Registe:ConnectionId=" + Context.ConnectionId + Environment.NewLine +"id="+ id);
            }
            public void BroadcastToAll(string message)
            {
                Clients.All.ReceiveMsg(Newtonsoft.Json.JsonConvert.SerializeObject(new { id = Context.ConnectionId, msg = message }));
            }
            public void BroadcastToSome(string[] ids, string message)
            {
                Clients.Clients(ids.ToList()).ReceiveMsg(Newtonsoft.Json.JsonConvert.SerializeObject(new { id = Context.ConnectionId, msg = message }));
            }
            //
            // 摘要:
            //     Called when the connection connects to this hub instance.
            //
            // 返回结果:
            //     A System.Threading.Tasks.Task
            public override async Task OnConnected()
            {
                var t = this;
                base.OnConnected();
                return;
            }
            //
            // 摘要:
            //     Called when a connection disconnects from this hub gracefully or due to a timeout.
            //
            // 参数:
            //   stopCalled:
            //     true, if stop was called on the client closing the connection gracefully; false,
            //     if the connection has been lost for longer than the Microsoft.AspNet.SignalR.Configuration.IConfigurationManager.DisconnectTimeout.
            //     Timeouts can be caused by clients reconnecting to another SignalR server in scaleout.
            //
            // 返回结果:
            //     A System.Threading.Tasks.Task
            public override async Task OnDisconnected(bool stopCalled)
            {
                var t = this;
                var infos = ClientMap.Where(a => a.Value == this.Context.ConnectionId);
                if (infos.Any())
                {
                    var info = infos.First();
                    lock (ClientMapLock)
                    {
                        ClientMap.Remove(info.Key);
                    }
                    Log.Write("", "Disconnected:ConnectionId=" + Context.ConnectionId + Environment.NewLine + "id=" + info.Key.Id);
                }
                base.OnDisconnected(stopCalled);
                return;
            }
            //
            // 摘要:
            //     Called when the connection reconnects to this hub instance.
            //
            // 返回结果:
            //     A System.Threading.Tasks.Task
            public override async Task OnReconnected()
            {
                var t = this;
                base.OnReconnected();
                return;
            }
            protected override async void Dispose(bool disposing)
            {
                var t = this;
                base.Dispose(disposing);
                return;
            }
        }

    (3)添加控制器HomeController,并添加试图方法:

            public ActionResult Index()
            {
                Guid id = Guid.NewGuid();
                Response.Cookies.Add(new HttpCookie("id", id.ToString()));//cookie将通过客户端的Registe实现与服务器的关联
                return View();
            }

    (4)前台Index试图如下:

    <!DOCTYPE html>
    <html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Home Page - 我的 ASP.NET 应用程序</title>
        
    </head>
    <body>
        
    
    <div>home</div>
    <div><input type="text" id="msg" /><input type="button" id="sendmsg" value="广播" /></div>
    <div id="divStatus"></div>
    <div>msgs:</div>
    <div id="msgContainer"></div>
    
        <script src="/Scripts/jquery-1.10.2.js"></script>
    
        <script src="/Scripts/jquery.cookie-1.4.1.min.js"></script>
        <script src="/Scripts/bootstrap.js"></script>
    <script src="/Scripts/respond.js"></script>
    
        
        <!--Script references. -->
        <!--The jQuery library is required and is referenced by default in _Layout.cshtml. -->
        <!--Reference the SignalR library. -->
        <script src="/Scripts/jquery.signalR-2.2.2.min.js"></script>
        <!--Reference the autogenerated SignalR hub script. -->
        <script src="/signalr/hubs"></script>
        <!--SignalR script to update the chat page and send messages.-->
        <script>
            $(function () {
                // hub名称(如若类名用特性重命名了,则是特性重命名的名称,否则就是类名的首字母小写;).
                var chat = $.connection.PlatHub;
                //启用浏览器端输出日志
                $.connection.hub.logging = true;
                // 客户端定义一个函数,服务器上可以调用.
                chat.client.ReceiveMsg = function (message) {
                    //var ob = $.parseJSON(message);
                    //                $("#msgContainer").append("<div>id:" + ob.code + "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;msg:" + ob.content + "</div>");
                    $("#msgContainer").append("<div>" + message+"</div>");
                };
                // Start the connection.
                $.connection.hub.starting(function () {
                    console.log('starting.')
                });
                $.connection.hub.received(function (e) {
                    console.log('received.'+e)
                });
                $.connection.hub.connectionSlow(function () {
                    console.log('connectionSlow.')
                });
                $.connection.hub.reconnecting(function () {
                    console.log('reconnecting.')
                });
                $.connection.hub.reconnected(function () {
                    console.log('reconnected.')
                });
                $.connection.hub.stateChanged(function (o, n) {
                    console.log('stateChanged.' + o + "," + n)
                });
                $.connection.hub.disconnected(function () {
                    console.log('disconnected.');
                    setTimeout(function () {
                        $.connection.hub.start();
                    }, 1000); // Restart connection after 1 seconds.
                });
                $.connection.hub.error(function (error) {
                    console.log('SignalR error: ' + error)
                });
                $.connection.hub.start().done(function () {
                    chat.server.Registe($.cookie('id'));//定义id,与管线clientid关联
                    $("#sendmsg").click(function () {
                        $.ajax({
                            url: 'GuangBo',
                            type: 'POST', //GET
                            async: true,    //或false,是否异步
                            data: {
                                msg: $("#msg").val()
                            },
                            timeout: 5000,    //超时时间
                            dataType: 'json',    //返回的数据格式:json/xml/html/script/jsonp/text
                            beforeSend: function (xhr) {
                                console.log(xhr)
                                console.log('发送前')
                            },
                            success: function (data, textStatus, jqXHR) {
                                if (data.code == 1) {
                                    $("#divStatus").val(new Date().toString() + ":成功");
                                }
                                else
                                    $("#divStatus").val(new Date().toString() + ":失败");
                            },
                            error: function (xhr, textStatus) {
                                console.log('错误')
                                console.log(xhr)
                                console.log(textStatus)
                            },
                            complete: function () {
                                console.log('结束')
                            }
                        });
                    });
                }).fail(function (error) {
                    console.log('fail Error: ' + error);
                });
            });
            // This optional function html-encodes messages for display in the page.
            function htmlEncode(value) {
                var encodedValue = $('<div />').text(value).html();
                return encodedValue;
            }
        </script>
    
    </body>
    </html>

    在前端代码中,如下代码是定义客户端的方法:

    chat.client.ReceiveMsg = function (message) {
                    //var ob = $.parseJSON(message);
                    //                $("#msgContainer").append("<div>id:" + ob.code + "&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;msg:" + ob.content + "</div>");
                    $("#msgContainer").append("<div>" + message+"</div>");
                };

    前端如下代码是访问服务器:

    chat.server.Registe($.cookie('id'));//Registe是PlatHub上通过特性HubMethodName定义的

    前端代码调用的后端控制器GuangBo实现如下:

            [HttpPost]
            public JsonResult GuangBo(string msg)
            {
                var chatHub = GlobalHost.ConnectionManager.GetHubContext<PlatHub>();
                chatHub.Clients.All.ReceiveMsg(msg);//给所有人
                return Json(new { code = 1 });
            }

    若希望给单独一个ID发送,可以采用如下:

            [HttpPost]
            public JsonResult ToSingle(string client,string msg)
            {
                var chatHub = GlobalHost.ConnectionManager.GetHubContext<PlatHub>();
                chatHub.Clients.Client(client).ReceiveMsg(msg);
                return Json(new { code = 1 });
            }

     可以通过

    HubName、HubMethodName

    两个特性重命名管线名称、服务器端注册的管线实现名称

  • 相关阅读:
    在Asp.Net中使用jQueryEasyUI(转)
    easyui简单使用
    0mq 入门 (转)
    windows钩子(转)
    Windbg简明教程(转)
    复合文档学习笔记 (转)
    解析eml文件
    强制windows系统重启at命令
    pygame 入门实例
    python 回溯法 子集树模板 系列 —— 18、马踏棋盘
  • 原文地址:https://www.cnblogs.com/mazhlo/p/8385353.html
Copyright © 2011-2022 走看看