SignalR 实现Web多人聊天室



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多人聊天室的更多相关文章
- Asp.net MVC + Signalr 实现多人聊天室
Asp.net SignalR 简介: 首先简单介绍一下Signalr ,我也是刚接触,觉得挺好玩的,然后写了一个多人聊天室. Asp.net SignalR 是为Asp.net 开发人员提供的一个库 ...
- Spring整合DWR comet 实现无刷新 多人聊天室
用dwr的comet(推)来实现简单的无刷新多人聊天室,comet是长连接的一种.通常我们要实现无刷新,一般会使用到Ajax.Ajax 应用程序可以使用两种基本的方法解决这一问题:一种方法是浏览器每隔 ...
- Apache MiNa 实现多人聊天室
Apache MiNa 实现多人聊天室 开发环境: System:Windows JavaSDK:1.6 IDE:eclipse.MyEclipse 6.6 开发依赖库: Jdk1.4+.mina-c ...
- 与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室
原文:与众不同 windows phone (31) - Communication(通信)之基于 Socket UDP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phon ...
- 与众不同 windows phone (30) - Communication(通信)之基于 Socket TCP 开发一个多人聊天室
原文:与众不同 windows phone (30) - Communication(通信)之基于 Socket TCP 开发一个多人聊天室 [索引页][源码下载] 与众不同 windows phon ...
- 多人聊天室(Java)
第1部分 TCP和UDP TCP:是一种可靠地传输协议,是把消息按一个个小包传递并确认消息接收成功和正确才发送下一个包,速度相对于UDP慢,但是信息准确安全:常用于一般不要求速度和需要准确发送消息的场 ...
- 使用Go语言+Protobuf协议完成一个多人聊天室
软件环境:Goland Github地址 一.目的 之前用纯逻辑垒完了一个可登入登出的在线多人聊天室(代码仓库地址),这次学习了Protobuf协议,于是想试着更新下聊天室的版本. 主要目的是为了掌握 ...
- 基于tcp和多线程的多人聊天室-C语言
之前在学习关于网络tcp和多线程的编程,学了知识以后不用一下总绝对心虚,于是就编写了一个基于tcp和多线程的多人聊天室. 具体的实现过程: 服务器端:绑定socket对象->设置监听数-> ...
- java socket之多人聊天室Demo
一.功能介绍 该功能实现了一个类似QQ的最简单多人聊天室,如下图所示. 二.目录结构 三.服务端 1)SocketServer类,该类是服务端的主类,主要负责创建聊天窗口,创建监听客户端的线程: pa ...
随机推荐
- HTTP 协议整理(转)
HTTP 协议 作为web开发人员,了解一些http协议的知识很有必要.本文简单介绍了HTTP协议的知识,若有错误的地方,望大家斧正. 1.HTTP协议是什么? http协议是一个应用层的协议.规定了 ...
- 西南大学校园GIS平台
系统架构是B/S,开发语言是C#.silverlight,开发平台是.NET,数据库为sqlserver,这是我读研究生时候自己做的作品,以自己的母校为地图,进行GIS相关的功能分析,核心的模块有:空 ...
- SAP Fiori和UI5的初学者导航
你是UI5和Fiori的新手?来对地方了. 对我来说,今年是不得不“跟上时代”去提升自己ABAP世界以外的技术技能的困难的一年.幸运的是,有很多可免费获得的信息和课程可以帮你实现这个跳跃.不要等着别人 ...
- JavaScript单元测试框架JsUnit基本介绍和使用
JavaScript单元测试框架JsUnit基本介绍和使用 XUnit framework XUnit是一套标准化的独立于语言的概念和结构集合,用于编写和运行单元测试(Unit tests). 每一个 ...
- ViewPager+GridView实现横向滑动 仿大众点评
先看演示效果: 1 ViewPager类提供了多界面切换的新效果. 新效果有如下特征: [1] 当前显示一组界面中的其中一个界面. [2] 当用户通过左右滑动界面时,当前的屏幕显示当前界面和下一个界 ...
- android SharedPreferences介绍
SharedPreferences是Android平台上一个轻量级的存储类,主要是保存一些常用的配置比如窗口状态,一般在Activity中重载窗口状态onSaveInstanceState保存一般使用 ...
- android 传感器应用
本章讲述Android开发中,传感器应用相关的知识点. 1.功能需求 做一个基于传感器的水平尺应用. 2.软件实现
- iOS 数字滚动 类似于老 - 虎- 机的效果
效果图 具体实现代码如下 ZCWScrollNumView.h文件 #import <UIKit/UIKit.h> typedef enum { ZCWScrollNumAnimation ...
- Unable to determine if the owner (Domain\UserName) of job JOB_NAME has server access
早上巡检的的时候,发现一数据库的作业报如下错误(作业名等敏感信息已经替换),该作业的OWNER为一个域账号: JOB RUN: 'JOB_NAME' was run on 2016-6-1 at 7: ...
- oracle树形查询 start with connect by
一.简介 在oracle中start with connect by (prior) 用来对树形结构的数据进行查询.其中start with conditon 给出的是数据搜索范围, connect ...