mvc中使用signalR简单应用

一、前言：

前段时间公司有这方面需求，了解到微软就这样一个技术，通过自己的实践和摸索。发现signalR类库很不错。而且网上也有很多可查的资料供大家学习，应用范围还是很广的。这篇文章把我在使用signalR开发过程中的使用步骤，以及遇到的问题讲述一下，希望对大家有帮助。

二、signalR简介

Asp.net SignalR是微软为实现实时通信的一个类库，一般情况下，signalR会使用JavaScript的长轮询(long polling)的方式来实现客户端和服务器通信，随着Html5中WebSockets出现，SignalR也支持WebSockets通信。另外SignalR开发的程序不仅仅限制于宿主在IIS中，也可以宿主在任何应用程序，包括控制台，客户端程序和Windows服务等，另外还支持Mono，这意味着它可以实现跨平台部署在Linux环境下。

signalR 内部有俩个类：

1.Http持久连接(Persisten Connection)对象：用来解决长时间连接的功能。还可以由客户端主动向服务器要求数据，而服务器端不需要实现太多细节，只需要处理PersistentConnection 内所提供的五个事件：OnConnected, OnReconnected, OnReceived, OnError 和 OnDisconnect 即可。

2.Hub（集线器）对象：来解决实时(realtime)信息交换的功能，服务端可以利用URL来注册一个或多个Hub，只要连接到这个Hub，就能与所有的客户端共享发送到服务器上的信息，同时服务端可以调用客户端的脚本。SignalR将整个信息的交换封装起来，客户端和服务器都是使用JSON来沟通的，在服务端声明的所有Hub信息，都会生成JavaScript输出到客户端，.NET则依赖Proxy来生成代理对象，而Proxy的内部则是将JSON转换成对象。

三、signalR简单使用

1.创建mvc项目，NuGet管理里添加SignalR Dll应用。

2.创建SignalR 的hub文件：

1、 HubName 属性：客户端与服务端对应的代理对象，缺省值为服务端的类。

2、 Hub 对象：支持所有客户端（Clients）推送消息。

3、 send方法：推送消息时调用。

4、Clients.All.addSomeMessage(clientname, msg) :客户端js调用此方法来接收数据。

5、服务实现一个客户端调用send方法向服务器发送message后，服务器将消息广播给调用接收方法的已连接的客户端。实现聊天功能。

3、实现hub客户端代码

1、注意：signalR 依赖于 jquery，所以 signalR 必须放在 jquery 之后，而 hubs 又必须放在 signalR 之后。

2、在HomeController中添加如下方法

 public ActionResult Index()
        {
            Random rnd = new Random();
            ViewBag.ClientName = "用户-" + rnd.Next(10000, 99999);
            return View();
        }

3、在view层：index.cshtml文件内写入一下代码：

<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>

　4、实现 HubDemo.js

@section scripts{    <script src="~/Scripts/jquery.signalR-2.2.2.min.js"></script><script src="~/signalr/hubs"></script><script type="text/javascript">    $(function () {        var chat = $.connection.chat;

        // Declare a function on the chat hub so the server can invoke it
        chat.client.addSomeMessage = function (clientname, msg) {
            $('#discussion').append('<li><strong>' + htmlEncode(clientname) + '</strong>: ' + htmlEncode(msg) + '</li>');

};

$('#displayname').val(prompt('Enter your name:', ''));
$('#message').focus();

        // Start the connection
        $.connection.hub.start().done(function () {
            $('#sendmessage').click(function () {
                // Call the Send method on the hub.
                chat.server.send($('#displayname').val(), $('#message').val());
                // Clear text box and reset focus for next comment.
                $('#message').val('').focus();
            });

});

        //A function to write events to the page
        function htmlEncode(value) {
            var encodedValue = $('<div />').text(value).html();
            return encodedValue;
        }

});
</script>

1）首先获取客户端页面的名字；

2）然后通过 $.connection.chat 建立对应服务器端 Hub 类的代理对象 chat；

3）定义客户端的 Javascript 方法 addSomeMessage ，服务器通过 dynamic 方式调用客户端的该方法以实现推送功能。在这里每当收到服务器推送来的消息，就在客户端页面的 messages 列表表头插入该消息。

4）当点击广播按钮时，客户端通过代理对象调用服务器端的 send 方法以实现向服务器发送消息。

5）通过 $.connection.hub.start(); 语句打开链接。

5、添加owinstartup文件初始化Hub文件。

4、编译运行Hub示例。

5、运行代码示例

运行时打开俩个页面。

来源：https://www.cnblogs.com/sjgao/p/7905213.html

标签

signalr