模块功能说明:

实现技术:sqlserver,MVC,WebAPI,ADO.NET,SignalR(服务器主动推送)

特殊车辆管理--->移动客户端采集数据存入数据库---->只要数据库数据有变化,服务端自动推送到Wbe页面展示(区别于传统的web请求)-->审核人员审核数据-->返回审核结果给移动客户端

在开发之前搜索了大量文档,也在QQ群咨询过群里的大牛,不少人都感觉比较懵逼的样子。有人建议使用ajax中的长连接,轮询等技术,最终还是决定使用SignalR技术实现页面刷新的效果:

搜索了不少博客园大牛有关于使用SignakR的博客,最后终于找到一个,也是我目前在项目中实现功能的Demo。

以下内容转自博客园园友杨根祥,感谢大牛提供资料,在此借鉴,如有不妥,请联系删除。

原博客中的代码在项目使用中有问题,已在下面代码中解决。

测试环境

.net 4.6

vs2015

mvc5

sqlserver2008

1.数据库

CREATE TABLE [dbo].[CarInfo](
[ID] [int] IDENTITY(1,1) NOT NULL,
[CarNo] [varchar](50) NOT NULL,
[Lng] [varchar](50) NOT NULL,
[Lat] [varchar](50) NOT NULL,
[LocDt] [datetime] NOT NULL,
 CONSTRAINT [PK_CarInfo] PRIMARY KEY CLUSTERED 
(
[ID] ASC
)WITH (PAD_INDEX  = OFF, STATISTICS_NORECOMPUTE  = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS  = ON, ALLOW_PAGE_LOCKS  = ON) ON [PRIMARY]
) ON [PRIMARY]
Go

数据库要使用service broker

ALTER DATABASE DBName SET NEW_BROKER WITH ROLLBACK IMMEDIATE;
ALTER DATABASE DBName SET ENABLE_BROKER;

初始化数据库

INSERT INTO CARINFO (CARNO,LNG,LAT,LOCDT) VALUES ('豫A12345','113.123','43.123',GETDATE())

2.新建MVC项目

安装SignalR包

Install-Package Microsoft.AspNet.SignalR

修改startup.cs

public partial class Startup
    {
        public void Configuration(IAppBuilder app)
        {
            ConfigureAuth(app);
            app.MapSignalR();
        }
    }

修改web.config,增加数据库连接字符串

<add name="ConnString" connectionString="data source=.;initial catalog=MySignalR;persist security info=True;user id=sa;password=yourpass;" providerName="System.Data.SqlClient" />

增加数据模

public class CarInfo
    {
        public int ID { get; set; }

        public string CarNo { get; set; }

        public string Lng { get; set; }

        public string Lat { get; set; }

        public DateTime LocDt { get; set; }
    }

新建类

public class CarInfoHub : Microsoft.AspNet.SignalR.Hub
    {
        public static void Show()
        {
            IHubContext context = GlobalHost.ConnectionManager.GetHubContext<CarInfoHub>();
            context.Clients.All.displayStatus();
        }
    }

业务实现

public class CarInfoRepository
    {
        public CarInfo GetData(int id)
        {
            using (var connection = new SqlConnection(ConfigurationManager.ConnectionStrings["ConnString"].ConnectionString))
            {
                connection.Open();
                using (SqlCommand command = new SqlCommand($"SELECT [ID],[CarNo],[Lng],[Lat],[LocDt] FROM [dbo].[CarInfo] WHERE ID = {0}", connection))
                {
                    command.Notification = null;

                    SqlDependency dependency = new SqlDependency(command);
                    dependency.OnChange += dependency_OnChange;

                    if (connection.State == ConnectionState.Closed)
                        connection.Open();

                    using (var reader = command.ExecuteReader())
                    {
                        while (reader.Read())
                        {
                            return new CarInfo()
                            {
                                ID = reader.GetInt32(0),
                                CarNo = reader.GetString(1),
                                Lng = reader.GetString(2),
                                Lat = reader.GetString(3),
                                LocDt = reader.GetDateTime(4)
                            };
                        }
                    }
                }
            }

            return null;
        }

        private void dependency_OnChange(object sender, SqlNotificationEventArgs e)
        {
            CarInfoHub.Show();
        }
    }

修改Global.asax

protected void Application_Start()
        {
            GlobalConfiguration.Configure(WebApiConfig.Register);
            SqlDependency.Start(ConfigurationManager.ConnectionStrings["ConnString"].ConnectionString);

            AreaRegistration.RegisterAllAreas();
            FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
            RouteConfig.RegisterRoutes(RouteTable.Routes);
            BundleConfig.RegisterBundles(BundleTable.Bundles);
        }

        protected void Application_End(object sender, EventArgs e)
        {
            SqlDependency.Stop(ConfigurationManager.ConnectionStrings["ConnString"].ConnectionString);
        }

新建API

public class DefaultController : ApiController
    {
        readonly CarInfoRepository _repository = new CarInfoRepository();

        // GET api/values
        public CarInfo Get(int id)
        {
            return _repository.GetData(id);
        }
    }

修改控制器

public ActionResult Index()
        {

//这里只是测试功能,指定了车辆编号
            ViewBag.ID = 1;
            return View();
        }

修改视图

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>车辆实时跟踪</title>
    <script src="~/Scripts/jQuery-1.10.2.min.js"></script>
    <script src="~/Scripts/jquery.signalR-2.2.1.min.js"></script>
    <script src="~/signalr/hubs" type="text/JavaScript"></script>
    <script type="text/javascript">
        var maxID;
        $(function () {
            var CarID = @ViewBag.ID;
            // Proxy created on the fly
            var job = $.connection.carInfoHub;

            // Declare a function on the job hub so the server can invoke it
            job.client.displayStatus = function () {
                getData();
            };

            // Start the connection
            $.connection.hub.start();
            getData();
        });

        function getData() {
            var $tbl = $('#tblJobInfo');
            $.ajax({
                url: '../api/Default/'+CarID,
                type: 'GET',
                datatype: 'json',
                success: function (data) {
                    $tbl.empty();
                    $tbl.append(' <tr><th>ID</th><th>CarNo</th><th>Lng</th><th>Lat</th></tr>');
                    var str ='<tr><td>' + data.ID + '</td><td>' + data.CarNo + '</td><td>' + data.Lng + '</td><td>' + data.Lat + '</td></tr>';
                    $tbl.append(str);
                }
            });
        }
    </script>
</head>
<body>
    <div>
        <table id="tblJobInfo" style="text-align: center; margin-left: 10px">
        </table>
    </div>
</body>
</html>

现在测试一下

update carinfo set 
Lng = CAST(Lng as float)+0.0001,
Lat = CAST(Lat as float)+0.0001,
LocDt = getdate();

面页数据可以实时发生变化。

下一步:使用 BootStrap框架中的Table展示数据,实现数据绑定,动态刷新。

1.使用SignalR实现页面即时刷新(服务端主动推送)的更多相关文章

  1. 使用SignalR从服务端主动推送警报日志到各种终端(桌面、移动、网页)

    微信公众号:Dotnet9,网站:Dotnet9,问题或建议:请网站留言, 如果对您有所帮助:欢迎赞赏. 使用SignalR从服务端主动推送警报日志到各种终端(桌面.移动.网页) 阅读导航 本文背景 ...

  2. 使用SignalR实现页面即时刷新(服务端主动推送)

    模块功能说明: 实现技术:sqlserver,MVC,WebAPI,ADO.NET,SignalR(服务器主动推送) 特殊车辆管理--->移动客户端采集数据存入数据库---->只要数据库数 ...

  3. 使用SignalR实现服务端消息推送

    概述 这篇文章参考的是Server Broadcast with SignalR 2这篇教程,很不错的一篇教程,如果有兴趣的话可以查看原文,今天记录下来作为一个学习笔记,这样今后翻阅会更方便一点. 这 ...

  4. Asp.net SignalR 实现服务端消息推送到Web端

              之前的文章介绍过Asp.net SignalR,  ASP .NET SignalR是一个ASP .NET 下的类库,可以在ASP .NET 的Web项目中实现实时通信.  今天我 ...

  5. SignalR Self Host+MVC等多端消息推送服务(1)

    一.概述 由于项目需要,最近公司项目里有个模块功能,需要使用到即时获得审批通知:原本的设计方案是使用ajax对服务器进行定时轮询查询,刚刚开始数据量和使用量不大的时候还好,后来使用量的增加和系统中各种 ...

  6. ASP.NET SignalR 系列(七)之服务端触发推送

    前面几章讲的都是从客户端触发信息推送的,但在实际项目中,很多信息可能是由系统服务端推送的,下面2图分别展示两种通道 客户端触发推送 服务端推送 下面我们就重点介绍下服务端如何调用集线器的对象进行推送 ...

  7. SignalR 实现web浏览器客户端与服务端的推送功能

    SignalR 是一个集成的客户端与服务器库,基于浏览器的客户端和基于 ASP.NET 的服务器组件可以借助它来进行双向多步对话. 换句话说,该对话可不受限制地进行单个无状态请求/响应数据交换:它将继 ...

  8. SignalR Self Host+MVC等多端消息推送服务(2)

    一.概述 上次的文章中我们简单的实现了SignalR自托管的服务端,今天我们来实现控制台程序调用SignalR服务端来实现推送信息,由于之前我们是打算做审批消息推送,所以我们的demo方向是做指定人发 ...

  9. SSE技术详解:使用 HTTP 做服务端数据推送应用的技术

    SSE ( Server-sent Events )是 WebSocket 的一种轻量代替方案,使用 HTTP 协议. 严格地说,HTTP 协议是没有办法做服务器推送的,但是当服务器向客户端声明接下来 ...

随机推荐

  1. jsp 获取应用目录

    ${pageContext.request.contextPath}  //   应用名为“demo1” 则得到的是"/demo1" <script>$(documen ...

  2. poi jar包介绍

    来自官网: Component Application type Maven artifactId Notes POIFS OLE2 Filesystem poi Required to work w ...

  3. Core Data使用之一(Swift): 获取

    //获取entity中的数据 func fetchFiles() { //第一步,获取总代理 let appDelegate = UIApplication.sharedApplication().d ...

  4. Xcache和memcache的比较

    Xcache 和 memcached 是两个不同层面的缓存,不存在可比性. Xcache 是 php 底层的缓存,它将PHP程式编译成字节码(byte code),再透过服务器上安装对应的程式来执行P ...

  5. 基于jquery 封装的 select 小控件,解决 IE6 7 8里 select 边框 高度 无法遮挡等问题

    一.基本原理 select控件在浏览器中是个永远的痛,不同的版本解析出来的可谓五花八门.主要有以下问题: 1,IE6中无法设置高度,Z INDEX永远在最上,无法被其它层遮挡 2,IE7中可以设置高度 ...

  6. Angular - - angular.forEach、angular.extend

    angular.forEach 调用迭代器函数取每一项目标的集合,它可以是一个对象或数组.迭代器函数与迭代器(value.key)一起调用,其中值是一个对象属性或数组元素的值,而数组元素是对象属性的关 ...

  7. 1.4.2.5. 测试(Core Data 应用程序实践指南)

    测试的方法也很简单: 首先,在AppDelegate.h里面引用CoreDataHelper @property (strong, nonatomic, readonly)CoreDateHelper ...

  8. php session 生命周期代码实例

     php session 生命周期代码实例        我们为什么需要Session,就是因为我们需要存储各个用户的状态数据.那么试问,如果由你来设计解决这个需求的方案,那么也许你会设置这样一个数据 ...

  9. 支持wmv、mpg、mov、avi格式的网页视频播放代码

    这2天一直在整金网奖的相关项目,比较头大的就是网页视频播放了,需要考虑各种不同格式的视频,然后找相应的视频播放器. 这次使用了2种方法对这些视频进行处理: 1.使用ckplayer网页视频播放器 ck ...

  10. Delphi-IP地址的隐藏

    IP地址的隐藏 一.前言 本文主要介绍如何在程序中实现IP地址的隐藏.其实这篇东西不算我写的.其中<IP头结构>部分我懒得打字,故复制.粘贴了孤独剑客的文章,先说声谢谢!代码部分参考了外国 ...