asp.net mvc signalr简单聊天室制作过程分析

signalr的神奇、实用很早就知道，但一直都没有亲自去试用，仅停留在文章，看了几篇简单的介绍文字，感觉还是很简单易用的。

由于最后有个项目需要使用到它，所以就决定写个小程序测试一下，实践出真知；别人写的文章，由于环境（版本等）不同，还是或多或少存在一些出入的。

环境：vs2013 / asp.net mvc 5 / signalr 2.2.1 / jquery 1.10.2

先上两个效果图：

系统会自动给加入聊天室的人员分配一个ID，是该人员的唯一标识（绿色为当前用户说的话，橙色为当前用户之外的人员说的话，对于不同窗口，当前用户指示的主体是不一样的哦，别弄绕了。。。）

下面来粗略叙述一下开发步骤：

1、安装signalr

建议使用nuget安装，能省不少事，网上也有全手工配置的。

2、修改startup.cs文件

开始的时候，我漏了这一步，发现始终生成不了/signalr/hubs，浏览器提示/signalr/hubs 400找不到

3、创建Hub

nuget安装了signalr之后，会有相应的signal分类

命名为ChatHub，也可以创建一个普通类，继承Microsoft.AspNet.SignalR.Hub即可。

简单的编写一个Send方法（请注意红框的两个方法名）

4、调用

页面需要引用三个主要脚本：

signalr是依赖于jquery的，所以这三个脚本引用有严格的先后顺序，如图，不可调换顺序。

以下为页面内容（请注意红框中的几个地方）：

chatHub：这是创建的ChatHub类，生成在/signalr/hubs下面的名称（默认为类名首字母小写）

用户也可以自己定义

这样hub名称就变成了设置的ChatHub（原来首字母小写，现在变成大写的了）

chat.client.receiveMessage：此处的receiveMessage，就是定义在ChatHub类，Send方法下的Clients.All.receiveMessage，原来看一些文档，此处的写法是chat.receiveMessage，但试下来没有效果，查看了/signalr/hubs脚本后，看到有client的定义，这块应该是由于signalr版本不同造成的，大家使用时要注意。

chat.server.send：此处的send，就是定义在ChatHub类下的Send方法，同样可能是对于以前版本的signalr，使用方法是chat.send，大家注意就是了。

5、结束

到这为止，一个简单的开发流程结束。打开两个或两个以上窗口，就可以发消息聊天了，试试吧

样式纯粹是自己瞎倒腾，写的不规范也乱七八糟，所以就不详细贴出扰乱视听。

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

赞 (0)

相关推荐

  • Asp.net SignalR创建实时聊天应用程序

    Asp.net SignalR创建实时聊天应用程序

    一.概述 使用 ASP.NET 那么 SignalR 2 创建一个实时聊天应用程序.将 SignalR 添加 MVC 5 应用程序中,并创建聊天视图发送并显示消息. 在Demo中,将学习SignalR 开发任务包括 ︰ 向 MVC 5 应用程序添加那么 SignalR 图书馆. 创建集线器和浩然启动类,以将内容推送到客户端. 使用 web 页中的那么 SignalR jQuery 库发送邮件并显示更新从集线器. 下面的屏幕快照显示在浏览器中运行的已完成的聊天应用程序. 二.实现 创建一个 ASP

  • Asp.net使用SignalR实现消息提醒

    Asp.net使用SignalR实现消息提醒

    一.引言 前面一篇文章我介绍了如何使用SignalR实现图片的传输,然后对于即时通讯应用来说,消息提醒是必不可少的.现在很多网站的都有新消息的提醒功能.自然对于SignalR系列也少不了这个功能的实现了.在这篇文章中将介绍如何使用SignalR+iNotify库来实现新消息的声音和弹框提醒. 二.消息提醒的实现思路 消息提醒也就是当客户有新消息来时,在客户端的右下角进行弹框提醒.要实现这个功能的思路是: 1.SignalR服务端推送消息到客户端的实现方式为调用客户端的receiveMessage

  • Asp.net SignalR支持的平台有哪些

    Asp.net SignalR支持的平台有哪些

    SignalR支持多种服务器和客户端配置.此外,每种传输方式都有自身的要求限制:如果某种传输方式不被系统支持,SignalR能够优雅地将故障转移到其他类型的传输方式. 系统要求 SignalR服务器组件可以被多种服务器配置所支持.本节介绍所支持的操作系统,.Net框架,IIS及其他组件. 支持的服务器操作系统 SignalR的服务器组件被以下服务器和客户端操作系统支持. Windows Server 2012 Windows Server 2008 R2 Windows 8 Windows 7

  • ASP.net实现页面跳转的方法

    主要是使用response的属性,代码如下: 复制代码 代码如下: protected void LinkButton1_Click(object sender, EventArgs e)         {             string url = "InfoShow.aspx";             Response.Redirect(url);         } protected void LinkButton1_Click(object sender, Even

  • 三种asp.net页面跳转的方法

    第一种方法:response.redirect 这个跳转页面的方法跳转的速度不快,因为它要走2个来回(2次postback),但它可以跳转到任何页面,没有站点页面限制(即可以由雅虎跳到新浪),同时不能跳过登录保护.但速度慢是其最大缺陷!redirect跳转机制:首先是发送一个http请求到客户端,通知需要跳转到新页面,然后客户端在发送跳转请求到服务器端.需要注意的是跳转后内部空间保存的所有数据信息将会丢失,所以需要用到session. 代码如下  using System; using Syst

  • Asp.NET MVC中使用SignalR实现推送功能

    Asp.NET MVC中使用SignalR实现推送功能

    一.简介 Signal 是微软支持的一个运行在 Dot NET 平台上的 html websocket 框架.它出现的主要目的是实现服务器主动推送(Push)消息到客户端页面,这样客户端就不必重新发送请求或使用轮询技术来获取消息. 可访问其官方网站:https://github.com/SignalR/ 获取更多资讯. 二.Asp.net SignalR 是个什么东东 Asp.net SignalR是微软为实现实时通信的一个类库.一般情况下,SignalR会使用JavaScript的长轮询(lo

  • 新发现原来documenet.URL也可以实现页面跳转

    在JavaScript我们常常使用的跳转语句是: window.location='http://www.jb51.net'; 其实,我们也可以用下面的语句来代替: document.URL='http://www.jb51.net/'; 演示: 无标题文档 alert('按确定跳转到首页');document.URL='http://www.jb51.net'; [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • ASP.NET笔记之页面跳转、调试、form表单、viewstate、cookie的使用说明

    ASP.NET笔记之页面跳转、调试、form表单、viewstate、cookie的使用说明

    1.页面跳转: (1 服务器传输 server.Transer(http://www.jb51.net);在定向到新页面后,还是会显示原来的URL,浏览器返回不会退回到原页面,历史记录也不会记录. 应用于完整的控制传输,例如安装向导. (2 超链接 (3 浏览器重定向 Redirect ,速度快,没有发送到服务器 (4 跨页发送 PostBackUrl="http://www.jb51.net" /> IsCrossPagePostBack用来判断是否为跨页提交 IsPostBa

  • SignalR发送页面跳转通知的方法

    微信商城使用支付宝支付的时候,需要有个过度页面提示用户用浏览器打开页面去支付,等用户在浏览器支付完之后再打开微信(微信此时依旧显示的是过度页面),过度页面需要跳转到订单详情页面.那么这个过度页面怎么知道需要跳转呢? 目前能想到的就是用SigbalR发送通知告诉那个过度页面去跳转. 第一步,先添加SigbalR相关dll. 第二步,自定义hub public class myHub:Hub { public override Task OnConnected() { return base.OnC

  • Asp.net使用SignalR实现发送图片

    Asp.net使用SignalR实现发送图片

    一.引言 在前一篇已经介绍了如何使用SignalR来实现聊天室的功能,在这篇文章中,将实现如何使用SignalR来实现发送图片的功能. 二.实现发送图片的思路 我还是按照之前的方式来讲述这篇文章,首先,让我们来理清下实现发送图片功能的思路. 图片的显示,除了直接指定图片的路径外(这种实现方式也称为:http URI schema),还可以通过Data Uri Schema的方式来显示图片.这种方式允许在网页里以字符串形式直接内嵌图片.形式如下所示: 复制代码 代码如下: <img src="

随机推荐