Asp.net SignalR 让实时通讯变得简单二--把Signa…

2018-06-22 07:56:08来源：未知阅读 ()

　　在 Asp.net SignalR 让实时通讯变得简单中思明分享了一个直接寄宿到IIS上的SignalR，SignalR同时也可以宿主在任何应用程序，包括控制台，客户端程序和Windows服务等，另外还支持Mono，这意味着它可以实现跨平台部署在Linux环境下。

　　在我参考的博文 [Asp.net 开发系列之SignalR篇]专题一：Asp.net SignalR快速入门中第四条 在桌面程序中如何使用Asp.net SignalR，就是把SignalR寄宿在WPF客户端中，我已经亲自体验过了，挺好用的；大家有想了解的可以去研究下。今天我在这里就和大家分享一下直接把SignalR寄宿到控制台中。

　　1、新建一个控制台应用程序

2、右击先建好的项目---> 选择管理NuGet程序包-->搜索 Microsoft.Owin.Cors 并安装-->搜索 Microsoft.AspNet.SignalR.SelfHost 并安装

待安装好Microsoft.AspNet.SignalR.SelfHost 后VS中会自动弹出readme.txt如下。里面详细介绍了如何把SignalR寄宿到控制台上的操作。

　　3、我们可以按照readme.txt中的讲解。修改Program.cs如下：

using Microsoft.AspNet.SignalR;
using Microsoft.Owin.Cors;
using Microsoft.Owin.Hosting;
using Owin;
using System;

namespace SelfSignalRSvc2._0
{
    public class Program
    {
        static void Main(string[] args)
        {
            // This will *ONLY* bind to localhost, if you want to bind to all addresses
            // use http://*:8080 or http://+:8080 to bind to all addresses. 
            // See http://msdn.microsoft.com/en-us/library/system.net.httplistener.aspx 
            // for more information.

            using (WebApp.Start<Startup>("http://localhost:118/"))
            {
                Console.WriteLine("Server running at http://localhost:118/");
                Console.ReadLine();
            }
        }
    }

    public class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            app.Map("/signalr", map =>
            {
                // Setup the cors middleware to run before SignalR.
                // By default this will allow all origins. You can 
                // configure the set of origins and/or http verbs by
                // providing a cors options with a different policy.
                map.UseCors(CorsOptions.AllowAll);

                var hubConfiguration = new HubConfiguration
                {
                    // You can enable JSONP by uncommenting line below.
                    // JSONP requests are insecure but some older browsers (and some
                    // versions of IE) require JSONP to work cross domain
                    // EnableJSONP = true
                };

                // Run the SignalR pipeline. We're not using MapSignalR
                // since this branch is already runs under the "/signalr"
                // path.
                map.RunSignalR(hubConfiguration);
            });
        }
    }
}

　　然后直接新建一个类ChatHub，继承Hub，并实现如下代码

using Microsoft.AspNet.SignalR;
using System;
using System.Diagnostics;
using System.Threading.Tasks;

namespace SelfSignalRSvc
{
    public class ChatHub : Hub
    {
        /// <summary>
        /// 供客户端调用的服务器端代码
        /// </summary>
        /// <param name="message"></param>
        public void Send(string message)
        {
            var name = Context.ConnectionId;
            // 调用所有客户端的sendMessage方法
            Clients.All.sendMessage(name, message);
        }

        /// <summary>
        /// 客户端连接的时候调用
        /// </summary>
        /// <returns></returns>
        public override Task OnConnected()
        {
            Trace.WriteLine("客户端连接成功:" + Context.ConnectionId);
            return base.OnConnected();
        }
    }
}

　　4、按照上面的操作，我们已经完成了脚本服务的开发。直接运行VS，控制台启动成功

　　5、下面我们需要新建一个html代码来验证脚本是否可用。

　　记得引用 jquery-1.10.2.js 和 jquery.signalR-2.2.2.min.js 同时修改脚本所在链接 http://localhost:118/signalr/hubs 和

需要指定寄宿的服务地址 $.connection.hub.url = 'http://localhost:118/signalr';

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试控制台程序是否可用</title>
    
</head>
<body>
<h2>Chat</h2>

<div class="container">
    <input type="text" id="message" />
    <input type="button" id="sendmessage" value="Send" />
    <input type="hidden" id="displayname" />
    <ul id="discussion"></ul>
</div>
<script src="jquery-1.10.2.js"></script>
        <!--引用SignalR库. -->
    <script src="jquery.signalR-2.2.2.min.js"></script>
     <!--引用自动生成的SignalR 集线器(Hub)脚本.在运行的时候在浏览器的Source下可看到 -->
     <script src="http://localhost:118/signalr/hubs"></script>
    <script>
        $(function () {
            // 1、引用自动生成的集线器代理 需要指定寄宿的服务地址
            $.connection.hub.url = 'http://localhost:118/signalr';
             var chat = $.connection.chatHub;

            // 2、开始连接服务器 done函数表明建立连接成功后为发送按钮注册了一个click事件
            $.connection.hub.start().done(function () {
                $('#sendmessage').click(function () {
                    // 调用服务器端集线器的Send方法 也要小写开头
                    chat.server.send($('#message').val());
                    // 清空输入框信息并获取焦点
                    $('#message').val('').focus();
                });
            });

            // 3、定义服务器端调用的客户端sendMessage来显示新消息
            chat.client.sendMessage = function (name, message) {
                // 向页面添加消息
                $('#discussion').append('<li><strong>' + htmlEncode(name)
                    + '</strong>: ' + htmlEncode(message) + '</li>');
            };

            // 设置焦点到输入框
            $('#message').focus();
        });
        
        // 为显示的消息进行Html编码
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }
    </script>
</body>
</html>