ASP .NET SignalR 是一个ASP .NET 下的类库,可以在ASP .NET 的Web项目中实现实时通信。什么是实时通信的Web呢?就是让客户端(Web页面)和服务器端可以互相通知消息及调用方法,当然这是实时操作的。
 
WebSockets是HTML5提供的新的API,可以在Web网页与服务器端间建立Socket连接,当WebSockets可用时(即浏览器支持Html5)SignalR使用WebSockets,当不支持时SignalR将使用其它技术来保证达到相同效果。
 
SignalR当然也提供了非常简单易用的高阶API,使服务器端可以单个或批量调用客户端上的JavaScript函数,并且非常 方便地进行连接管理,例如客户端连接到服务器端,或断开连接,客户端分组,以及客户端授权,使用SignalR都非常 容易实现。
 
SignalR 将与客户端进行实时通信带给了ASP .NET 。当然这样既好用,而且也有足够的扩展性。以前用户需要刷新页面或使用Ajax轮询才能实现的实时显示数据,现在只要使用SignalR,就可以简单实现了。
 
说了这么多,其实可以简单的认为,SignalR就是客户端调用服务端的方法,服务端再去调用客户端的方法,本文实现的是利用SignalR实现Web多人聊天,页面搭建用的Bootstrap,先看下效果图
 
1.新建Web应用程序,Empty空模板
 
 
2.NuGet安装SignalR,这个有你很多依赖项,我们直接安装MicroSoft.AspNet.Signalr
 
 
3.项目添加新建项,OWIN Startup类,Startup是程序启动的入门点,我们在这路注册Signalr
 
namespace WebApplication2
{
public class Startup
{
public void Configuration(IAppBuilder app)
{
// 有关如何配置应用程序的详细信息,请访问 http://go.microsoft.com/fwlink/?LinkID=316888
app.MapSignalR();
}
}
}

4.如果SignalR组件安装完成以后,项目右键新建项,会多出SignalR这一项,新建 SignalR集线器类

namespace WebApplication2.hubs
{
[HubName("myhub")] //这个HubName很重要
public class MyHub : Hub
{
public void SendMessage(string name, string message)
{
Clients.All.receiveMessage(name, message);
}
}
}

5.新建Html页面,你没有看错,就是Html页面

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<meta charset="utf-8" /> <link href="bootstrap/css/bootstrap.css" rel="stylesheet" />
<script src="Scripts/jquery-1.6.4.js"></script>
<script src="Scripts/jquery.signalR-2.2.0.js"></script>
<script src="/signalr/hubs"></script> </head>
<body style="padding-top:40px;">
<div class="container">
<div class="jumbotron">
<ul id="message" style="height:400px;overflow-y:scroll;"></ul>
</div>
<input id="name" type="email" class="form-control" style="margin-bottom:5px;">
<input id="txt" type="email" class="form-control" style="margin-bottom:5px;">
<button id="send" type="button" class="btn btn-primary btn-block">Send</button> </div> <script type="text/javascript">
$(function () { //接收数据
var con = $.connection.myhub;
con.client.receiveMessage = function (name, message) { $("#message").append("<li><b>" + name + "</b>Say:" + message + "</li>");
} //发送数据
$.connection.hub.start().done(function () { $("#send").click(function () { con.server.sendMessage($("#name").val(),$("#txt").val());
}); });
})
</script> </body>
</html>

做到这里就大功告成了,如果没有出效果的话,我说下可能会出错的地方, var con = $.connection.myhub; 这个myhub一定要跟Hub.cs的 [HubName("myhub")] 对应。

核心代码:

JS

           //接收数据
var con = $.connection.myhub; con.client.receiveMessage = function (name, message) { $("#message").append("<li><b>" + name + "</b>Say:" + message + "</li>");
} //发送数据
$.connection.hub.start().done(function () { $("#send").click(function () { con.server.sendMessage($("#name").val(),$("#txt").val());
}); });

C#

namespace WebApplication2.hubs
{
[HubName("myhub")]
public class MyHub : Hub
{
public void SendMessage(string name, string message)
{
Clients.All.receiveMessage(name, message);
}
}
}

仔细研究下,它就是Client调用Server的方法,Server调用Client的方法。

 

SignalR 实现Web多人聊天室的更多相关文章

  1. Asp.net MVC + Signalr 实现多人聊天室

    Asp.net SignalR 简介: 首先简单介绍一下Signalr ,我也是刚接触,觉得挺好玩的,然后写了一个多人聊天室. Asp.net SignalR 是为Asp.net 开发人员提供的一个库 ...

  2. Spring整合DWR comet 实现无刷新 多人聊天室

    用dwr的comet(推)来实现简单的无刷新多人聊天室,comet是长连接的一种.通常我们要实现无刷新,一般会使用到Ajax.Ajax 应用程序可以使用两种基本的方法解决这一问题:一种方法是浏览器每隔 ...

  3. Apache MiNa 实现多人聊天室

    Apache MiNa 实现多人聊天室 开发环境: System:Windows JavaSDK:1.6 IDE:eclipse.MyEclipse 6.6 开发依赖库: Jdk1.4+.mina-c ...

  4. 与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室

    原文:与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phon ...

  5. 与众不同 windows phone (30) - Communication(通信)之基于 Socket TCP 开发一个多人聊天室

    原文:与众不同 windows phone (30) - Communication(通信)之基于 Socket TCP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phon ...

  6. 多人聊天室(Java)

    第1部分 TCP和UDP TCP:是一种可靠地传输协议,是把消息按一个个小包传递并确认消息接收成功和正确才发送下一个包,速度相对于UDP慢,但是信息准确安全:常用于一般不要求速度和需要准确发送消息的场 ...

  7. 使用Go语言+Protobuf协议完成一个多人聊天室

    软件环境:Goland Github地址 一.目的 之前用纯逻辑垒完了一个可登入登出的在线多人聊天室(代码仓库地址),这次学习了Protobuf协议,于是想试着更新下聊天室的版本. 主要目的是为了掌握 ...

  8. 基于tcp和多线程的多人聊天室-C语言

    之前在学习关于网络tcp和多线程的编程,学了知识以后不用一下总绝对心虚,于是就编写了一个基于tcp和多线程的多人聊天室. 具体的实现过程: 服务器端:绑定socket对象->设置监听数-> ...

  9. java socket之多人聊天室Demo

    一.功能介绍 该功能实现了一个类似QQ的最简单多人聊天室,如下图所示. 二.目录结构 三.服务端 1)SocketServer类,该类是服务端的主类,主要负责创建聊天窗口,创建监听客户端的线程: pa ...

随机推荐

  1. Ajax的核心对象创建步骤

    * Ajax具有核心对象 * XMLHttpRequest对象 * 如何创建XMLHttpRequest对象 function getXhr(){ // 声明XMLHttpRequest对象 var ...

  2. 原生JS:严格模式详解

    严格模式 本文参考MDN做的详细整理,方便大家参考[MDN](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript) 设计目的 设立”严格模式 ...

  3. UIView

    //command+R   运行 //command+.   停止 //command+B   预编译 //command+1.2.3  模拟器大小 //command+shift+h  home键 ...

  4. AppDelegate动态加载StoryBoard

    - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launc ...

  5. Android中的HTTP通信

    前言:近期在慕课网学习了慕课网课程Android中的HTTP通信,就自己总结了一下,其中参考了不少博文,感谢大家的分享. 文章内容包括:1.HTTP简介2.HTTP/1.0和HTTP/1.1之间的区别 ...

  6. python之面向对象与构造函数

    一.面向对象介绍 不同的编程范式本质上代表对各种类型的任务采取的不同的解决问题的思路, 大多数语言只支持一种编程范式, 当然也有些语言可以同时支持多种编程范式. 两种最重要的编程范式分别是面向过程编程 ...

  7. Atitit.木马病毒自动启动-------------win7计划任务的管理

    Atitit.木马病毒自动启动-------------win7计划任务的管理 1. 计划任务的Windows系统中取代AT 的schtasks命令1 2. Win本身的系统计划任务列表1 2.1.  ...

  8. 【转载】latch: cache buffers chains

    本文转自惜分飞的博客,博客原文地址:www.xifenfei.com/1109.html,支持原创,分享知识! 当一个数据块读入sga区,相应的buffer header会被放置到hash列表上,我们 ...

  9. iOS 10 的坑:新机首次安装 app,请求网络权限“是否允许使用数据”(转)

    症状 iOS 10 之后,陆陆续续地有用户联系我们,说新机第一次安装.第一次启动的时候,app 首屏一片空白,完全没数据.kill 掉重新打开就好了. 一开始以为是用户网络情况不好,但随着越来越多的用 ...

  10. 使用本地JConsole监控远程JVM(最权威的总结)

    问题背景   Tomcat经常崩溃crash,想看看JVM内存使用情况,就想到了用Jconsole监控,以前只是监控本地的JVM,这次要监控远程的,遇到了不少问题.   经过几个小时的努力,参考了众多 ...