ASP.NET MVC实现简单的实时消息推送

因为项目的需要，有必要在网页上推送消息。在百度上搜索了一下，发现ASP.NET的SignalR类库可以用来在网页上推送消息，当然也可以使用H5 WebSocket Ajax的转世。当然，这里我们使用ASP.NET的信号员类库。因为它可以在网页上实时推送消息。什么是实时推送？让我简单解释一下我个人的理解。实时性：同时发生的事情在计算机中并不是绝对实时的，因为CPU在同一时间片只能处理一个任务，那么这个时候问题又来了？

我们通常如何使用电脑、上网和听音乐？因为现在的CPU非常快。CPU会把处理不同任务的时间片分割开来，CPU会把时间片分割成非常小的，小到我们人类无法感知。比如这个时间片，CPU在处理音乐任务，下一个时间片，CPU在处理互联网任务。因此，我认为计算机中没有绝对的实时性，但我们人类无法感知。

推送：这里的推送是指网页上的消息推送。例如，用户A和B在各自的计算机上打开同一个消息推送网页。假设用户A现在向用户b发送消息，它要经过这样一个过程：用户A-服务器-用户b，当然具体的底层实现过程我就不讨论了。因为这不是现在要讨论的话题。因为服务器的地址通常是固定的。因此，客户端更容易向服务器发送消息，因为目的地址是固定的。服务器如何向客户端发送消息？这有点不对，因为客户端的地址不是固定的，http是无状态的，所以用户的地址记不住。

因此，为了解决这个问题，计算机的祖先使用了几种方法：

1.客户的心跳。每隔一段时间访问一次服务器，查看服务器是否有任何客户端任务。Ajax的循环就是这个方法。缺点是实时性不太高。

2.服务器和客户端之间的长连接。这个想法被信号员所采用。缺点：服务器压力大。

好了，现在我们来谈谈什么是信号员。SignalR是一个面向ASP.NET开发者的库，可以简化向应用程序添加实时Web功能的过程。实时Web功能是指服务器代码可以在内容可用时立即将内容推送到连接的客户端，而不是让服务器等待客户端请求新数据的功能。这也实现了消息的实时推送。我个人对实现原理的理解是，服务器首先定制一个函数，让一个客户端调用并向另一个客户端发送消息。当然，客户端也需要选择一个功能。因为服务器需要调用客户端的这个函数。

下面就来说说具体的操作方法。1.环境：我在win 10 VS2015社区版中使用了ASP.NET MVC。打开VS 2015|文件|新建|项目(SignalRMvc)|asp.net Web应用|空模板，Mvc，平台大概是这样的。现在我们来谈谈要包含的具体文档。1)、信号员集线器类。用于编写调用客户端段的函数。2) OWIN班。用于注册服务器的函数。3)首页(包括消息框和功能的编译)当然前台需要一些文件。

一般VS不会自带SignalR类，所以我们需要在开始任务前添加这个功能。选择VS |Nuget包管理器|Nuget包管理器控制台|安装包微软的工具。aspnet。信号员安装信号员。安装完成后，1。我们为聊天中心|创建一个新文件夹，并创建一个信号中心类，并编写以下代码：

使用微软。信号员；命名空间SignalRMvc .聊天中心{公共类ChatHub : Hub { public void send message(字符串名称，字符串消息){ //客户端.全部。hello()；客户All.receiveMessage(名称，消息);//用户调用客户端的函数} }}2、在聊天中心文件夹下新建一个OWIN类。并写上如下代码：

使用微软哦.使用owin[程序集： OwinStartup(信号类型(rmvc .聊天中心。启动).聊天中心{公共类启动{公共无效配置(IAppBuilder应用程序){ app } .mapsignor()；//服务器的中心注册} }}3、在控制器新建一个主页控制器。并写上如下代码：

使用系统网络。手动音量调节命名空间SignalRMvc .控制器{公共类家庭控制器：控制器{//GET:家庭公共操作结果ClientChat(){ return View()；} }}4、在控制器的方法上右击添加视图（不使用模板，也不使用布局页)后。并写上如下代码：

@ { Layout=null}！DOCTYPE html html head meta http-equiv=' Content-Type ' Content=' text/html；字符集=utf-8 '/title/title元字符集=' utf-8 '/link href=' ~/Content/bootstrap。量滴CSS ' rel='样式表/@* BootStarp的引入* @ style # message _ box { height : 400 px；溢出-y:滚动；} /style @*呈现消息* @/head body div class=' container ' div class=' row ' div class=' jumbo tron ' ul id=' message _ box '/ul/div发送者名称：输入id=' text _ name ' class=' form-control '/br/消息内容： textarea id=' text _ message ' class=' form-control ' rows=' 3 '/textarea br/button id=' BTN _ send ' class=' BTNBTN-阻止BTN-成功' send/button/div/div脚本src=' http : ~/scripts/jquery-3。1 .0 .量滴js '/脚本脚本src=' http : ~/scripts/jquery。信号-2。2 .1 .量滴js '/脚本上述引入的两个文件的顺序不以交换，因为下面这个文件依赖于上面那个文件* @ script src=' http : ~/signor/hubs '/script！-本地没有，动态生成-script $(function(){ var $ messageBox=$(' # message _ box ')；var $ textMessage=$(' # text _ message ')；var $ text name=$(' # text _ name ')；//客户端先与服务器连接起来，拿到服务器的代理操作对象var HubConnection=$。连接。ChatHub//注册客户端函数轮毂连接。客户。接收消息=函数(名称，消息){ $ messagebox。追加(' Li '名称'比如： ' message '/Li ')}//启动连接到服务器$.connection.hub.start().done(function () { $('#btn_send ')).bind('click '，function () { //调用服务端的函数轮毂连接。服务器。发送消息($ textname。val()，$文本消息。val())；});});});/脚本/正文/html如果直接复制使用。要注意前台的代码引入的文件的目录及版本。前台代码的命名的首字母最好使用小写，后台代码的首字母最好使用大写。因为射流研究…默认使用的是驼峰命名法，C夏普使用帕斯卡命名方式。如果没有注重这个细节就会很容易出错。因为后台代码在执行的时候会动态的生成一些射流研究…代码，JS代码的默认使用的驼峰命名法。如果你在前台的代码用了帕斯卡命名方式就很容易出错了。并且还不好找。我是有过亲身经历的。

下面我们在本地测试下：分别使用火狐浏览器和铬来模拟两个客户端，当然自身的电脑也就服务端。效果图如下：

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。