Ajax+SignalR实现多客户端数据同步更新（1） 经验分享

初学SignalR，仅供大家参考，本来是想实现更改数据库，客户端实时更新的，现在只是实现客户端之前的无刷新同步更新，后期解决了会继续更新，记录下来方便以后回忆

首先创建一个Web工程 ，然后在项目中引入SignalR的包以及JQuery的包，我个人的如下图，具体需要什么可以根据个人需要

第一步把需要的环境准备好之后，接着就可以开始编码了

首先创建一个Startup.cs类，该类的作用就是启用SignalR，类代码如下：

</pre><pre class="objc" name="code">using Microsoft.Owin;using Owin;using System.Configuration;using System.Data.SqlClient;[assembly: OwinStartup(typeof(SignalRChat.Startup))]namespace SignalR{    public class Startup    {        public void Configuration(IAppBuilder app)        {            // Any connection or hub wire up and configuration should go here            app.MapSignalR();        }    }}

然后就要创建一个SignalR的类了，如果项目中引入了SignalR，可以直接在添加项中找到添加SignalR的类。如下图

<img src="http://img.blog.csdn.net/20160813103650455?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" alt="" />

定义了SignalR的类之后，可以看到类自动继承了Hub类，然后我们在类里添加一个方法

        public void updateTa()//<strong><u><span style="background-color: rgb(255, 255, 51);">这里注意：如果我们定义的名称是大写开头(如：UpdateTa)，但是我们调用的时候要 写成 updateTa()</span></u></strong>        {            Clients.All.displayDatas();//所有客户端触发的函数        }

然后创建一个 Global.asax，该全局调用类是为了与数据库更新保持一致用的，多客户端 之间的同步不需要使用该类

using System;using System.Collections.Generic;using System.Configuration;using System.Data.SqlClient;using System.Linq;using System.Web;using System.Web.Security;using System.Web.SessionState;namespace SignalR{    public class Global : System.Web.HttpApplication    {        protected void Application_Start(object sender, EventArgs e)        {

    //开始数据库的更新监听            SqlDependency.Start(ConfigurationManager.ConnectionStrings["testConnectionString"].ConnectionString);        }        protected void Session_Start(object sender, EventArgs e)        {        }        protected void Application_BeginRequest(object sender, EventArgs e)        {

        }        protected void Application_AuthenticateRequest(object sender, EventArgs e)        {        }        protected void Application_Error(object sender, EventArgs e)        {        }        protected void Session_End(object sender, EventArgs e)        {        }        protected void Application_End(object sender, EventArgs e)        {

   //停止数据库的更新监听            SqlDependency.Stop(ConfigurationManager.ConnectionStrings["testConnectionString"].ConnectionString);        }    }}

然后就可以 编写view页面了，创建一个main.aspx页面，引入下面几个js和为SignalR使用的文件夹

 <span style="color:#ff0000;"><script src="Scripts/jquery-1.6.4.min.js" type="text/javascript"></script>    <span style="color:#000000;"><!--Reference the SignalR library. --></span>    <script src="/Scripts/jquery.signalR-2.0.0.js" type="text/javascript"></script><span style="color:#000000;">    <!--Reference the autogenerated SignalR hub script. --></span>    <script src="/signalr/hubs"></script></span>

<span style="color:#000000;">然后加入下列js语句</span>

<span style="color:#ff0000;"></span><pre class="javascript" name="code"><span style="color:#000000;">     <script type="text/javascript">         $(function () {             var chat = $.connection.chatHub;//调用类             $.connection.hub.start();             getData();             $.connection.hub.start().done(function () {                 getData();                 chat.server.updateTa();//启动完后，调用SignalR定义类中的方法，就会触发下面的displayDatas的方法，从而获取数据                             });                          chat.client.displayDatas = function () {                 getData();             };             function getData() {                 $.ajax({                     type: 'POST',                     url: 'DataPage.aspx',                     datatype: 'text',                     success: function (data) {                         $("#Label1").text(data);                     },                     error: function (XMLHTTPRequest,textStatus,errorThrown) {                         alert(XMLHTTPRequest + "||" + textStatus + "||" + errorThrown);                     }                 })             }         });     </script></span>

<span style="color:#000000;">（注：这里main页面为了简便就简单加一个label1）</span>

<span style="color:#000000;">DataPage.aspx页面在page_load里加上</span>

<span style="color:#000000;">      Response.Clear();             Response.Write(returnMsg);//returnMsg为返回的string类型             Response.End();             return;</span>

<span style="color:#000000;">到这里我的SignalR的第一个项目就算完成了</span>

其实我发现SignalR的整个使用方法都很简单，主要就分为启动，客户端调用方法，其他都已经封装好了，不用太多的考虑。

参考：http://www.th7.cn/Program/net/201607/891335.shtml