不用找了,比较全的signalR例子已经为你准备好了.

 

这几天想着将一个winform的工具上线到web上,因为对时时性的要求比较高,找朋友咨询了一下推荐了SignlarR 框架,比较强大.昨天才看到,今天研究了一下将里面的例子都拿出来共享.

最全的参考:http://www.asp.net/signalr/overview/getting-started

关于如果安装SignalR: NuGet命令:

PM> Install-Package Microsoft.AspNet.SignalR

<------------1:与他人聊天:<------------

后台代码示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;
using Microsoft.AspNet.SignalR.Hubs;
 
namespace SignalRChat.Hubs.Data
{
    [HubName("<span style="color: #ff0000;">ViewDataHub</span>")]
    public class ViewDataHub : Hub
    {
        //this is just called by client and return the value for it .
        public string Hello()
        {
            return "hello";
        }
 
 
 
        //this fucntion will be called by client and the inside function
        //Clients.Others.talk(message);
        //will be called by clinet javascript function .
        public void <span style="color: #ff0000;">SendMessag</span>(string message)
        {
            Clients.Others.<span style="color: #ff0000;">talk</span>(message);
        }
 
    }
}

  

小提示:注意其它的红色字体部分

前台代码示例:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<!DOCTYPE html>
<head>
    <title></title>
    <!--Script references. -->
    <!--Reference the jQuery library. -->
    <script src="Scripts/jquery-1.10.2.min.js"></script>
    <!--Reference the SignalR library. -->
    <script src="Scripts/jquery.signalR-2.0.2.js"></script>
    <!--Reference the autogenerated SignalR hub script. -->
    <script src='signalr/hubs'></script>
    <!--Add script to update the page and send messages.-->
    <script type='text/javascript'>
 
 
        $(function () {
            // Declare a proxy to reference the hub.
            var chat = $.connection.ViewDataHub;
 
 
            //init the client function
            init(chat);
 
 
            $("#btnclick").click(function () {
                //Response the information
                $.connection.hub.start().done(function () {
                    chat.server.hello().done(function (res) {
                        alert(res);
                    })//end of done function
                })//the end of the $.connection
            })//end of click function
 
 
 
            $("#btntalk").click(function () {
                $.connection.hub.start().done(function () {
                    chat.server.<span style="color: #ff0000;">sendMessag</span>($("#txttalk").val());
                    $("#txttalk").val("");
                })//the end of the $.connection
 
            });//btntalk end
 
        })
 
 
        //init the client method
        function init(chat) {
 
            chat.client.<span style="color: #ff0000;">talk</span> = function (message) {
                var talk = "<h1>" + message + "</h1>";
 
                $("#dvtalk").append(talk);
 
            } //end regist the client function
 
        } //end of the initfunction
 
    </script>
</head>
<body>
    <div>
        <table id="tbtoday"></table>
        <input type="text" id="txttalk" width="150"/>
        <input type="button" id="btnclick" value="clickme" />
        <input type="button" id="btntalk" value="talkwithme" />
        <div id="dvtalk">
 
        </div>
    </div>
</body>
</html>

  

出现的效果:

两个窗口之间的聊天

我知道你心中肯定有疑问,我也是这样,当我刚接触的时候完全搞不懂这是为什么会这样,我们来回顾一次正常的聊天过程:

客户端A发送信息->服务端接收->服务端Post消息给客户端B

那我们重新拆分以上的方法来证明我们的猜想是否正确

1
2
3
4
5
6
7
$("#btntalk").click(function () {
    $.connection.hub.start().done(function () {
        chat.server.sendMessag($("#txttalk").val());
        $("#txttalk").val("");
    })//the end of the $.connection
 
});//btntalk end

chat.server.sendMessage(message) 从客户端调用了服务器的方法(服务器扮演的是中转站的角色).

此时的message 从客户端A发送给了服务端

那服务器就应该有这样的一个方法与之相对应

后台代码:

1    //this fucntion will be called by client and the inside function
2 //Clients.Others.talk(message);
3 //will be called by clinet javascript function .
4 public void SendMessag(string message)
5 {
6 Clients.Others.talk(message);
7 }

服务端接收到A发送来的message.

这个时候服务端将消息推送给客户端B

Clients.Others.talk(message);

这个时候客户端B应该有一个talk的方法来将消息显示出来

 1   //init the client method
2 function init(chat) {
3
4 chat.client.talk = function (message) {
5 var talk = "<h1>" + message + "</h1>";
6
7 $("#dvtalk").append(talk);
8
9 } //end regist the client function
10
11 } //end of the initfunction

这个时候客户端B接收到消息,用Js的方法显示出来消息. 一次通话就完成了.

<------------二,客户端传递参数给服务端并从服务端得到返回值:<------------

前端代码:

 

后端代码:

 

效果图:

<------------三,客户端刷时时的刷新数据<------------ 

前端:

 

后端:

 

注:本次实现的所谓的时时刷新数据和官方提供的Demo有很大的差异,并不是后台代码的角度来刷新,而是从前端的角度来实现的。

====>点我下载DEMO<====

 

signalR例子的更多相关文章

  1. 不用找了,比较全的signalR例子已经为你准备好了.

    这几天想着将一个winform的工具上线到web上,因为对时时性的要求比较高,找朋友咨询了一下推荐了SignlarR 框架,比较强大.昨天才看到,今天研究了一下将里面的例子都拿出来共享. 最全的参考: ...

  2. 不用找了,比较全的signalR例子已经为你准备好了(2)---JqGrid 服务端刷新方式-注释详细-DEMO源码下载

    上次用客户端进行数据刷新的方式,和官方的Demo实现存在差异性,今天花了一点时间好好研究了一下后台时时刷新的方式.将写的代码重新update了一次,在这之前找过好多的资料,发现都没有找到好的例子,自己 ...

  3. MVC的SignalR例子

    # SignalR学习 ASP.NET SignalR 是为.NET 开发者提供即时通讯Web 应用的类库.即时通讯Web服务就是服务器将内容自动推送到已经连接的客户端,而不是服务器等待客户端发起一个 ...

  4. 一个简单的SignalR例子

    本文介绍如何使用SignalR的Hub制作一个简单的点赞页面.不同浏览器(或者不同窗口)打开同一个页面,在任何一个页面点赞,所有页面同时更新点赞数. 1.使用Visual Studio Communi ...

  5. SignalR的客户端.NET Client介绍

    SignalR支持两种客户端:JavaScript Client和.NET Client.一个简单的SignalR例子中的SignalRDemo(点赞页面)就是JavaScript Client(HT ...

  6. ASP.NET Core: 全新的ASP.NET !

    背景 最新版本的 ASP.NET 叫做 ASP.NET Core (也被称为 ASP.NET 5)   它颠覆了过去的 ASP.NET. 什么是 ASP.NET Core? ASP.NET Core ...

  7. 全新的ASP.NET !

    全新的ASP.NET ! 背景 最新版本的 ASP.NET 叫做 ASP.NET Core (也被称为 ASP.NET 5)   它颠覆了过去的 ASP.NET. 什么是 ASP.NET Core? ...

  8. 第三章SignalR在线聊天例子

    第三章SignalR在线聊天例子 本教程展示了如何使用SignalR2.0构建一个基于浏览器的聊天室程序.你将把SignalR库添加到一个空的Asp.Net Web应用程序中,创建用于发送消息到客户端 ...

  9. [asp.net core]SignalR一个例子

    摘要 在一个后台管理的页面想实时监控一些操作的数据,想到用signalR. 一个例子 asp.net core+signalR 使用Nuget安装包:Microsoft.AspNetCore.Sign ...

随机推荐

  1. ISAPI_Rewrite不起作用的N种原因

    现在经常用到ISAPI_Rewrite,遇到的问题就是在本地测试的时候,一切没有问题,到服务器上,竟然不起作用.郁闷~经过我的一些探索,发现了比起作用的原因如下:1.IIS_WPG对ISAPI_Rew ...

  2. sizeof运营商

    sizeof它是C语言的关键字,它计算对象所占用的字节数.采用sizeof通过计算对象的大小,占用的对象是一个良好的编程习惯二手. ★你得到的内置型尺寸 一些内置类型的大小会随着体系结构的不同而不同, ...

  3. centos下一个bash: XXX: command not found解决方案

    最近想centos通过做Android工程建设.配置jdk和Android sdk后,也同时/etc/profile将java和Android环境变量配置成,但它不能像windows 在相同,直接使用 ...

  4. Oracle批量执行脚本文件

    以下是Oracle批量执行脚本文件的步骤和方法 1.创建脚本文件(xx.sql): 例如文件CreateTable Create table tb1( id varchar2(30), Name va ...

  5. mumu血压计母亲节“拼团”盛大开幕,百度和厂家创造一个双赢的局面

        在BAT的互联网时代.似乎不论什么新兴产品和服务都不能脱离BAT的支持,作为中国互联网体量最庞大的三家企业.BAT代表的是资源优势.用户优势.品牌优势.因此,一旦脱离BAT的支持,想迅速做大无 ...

  6. 分布式数据库中间件–(2) Cobar与client握手身份验证

    Cobar启动完毕,监听特定端口.整个认证的流程图: NIOAcceptor类继承自Thread类,该类的对象会以线程的方式执行,进行连接的监听. NIOAcceptor启动的初始化步骤例如以下: 1 ...

  7. 基于Hadoop2.2.0版本号分布式云盘的设计与实现

    基于Hadoop2.2.0版本号分布式云盘的设计与实现 一.前言 在学习了hadoop2.2一个月以来,我重点是在学习hadoop2.2的HDFS.即是hadoop的分布式系统,看了非常久的源代码看的 ...

  8. 自己的自定义单元格(IOS)

    定义自己的单位格有三种方法 - 代码 - xib - storyboard(推荐) 操作方法故事板 1.在TableView财产Prototype Cells至1.莫感觉1: 2.须要创建自己定义的单 ...

  9. SCM白色幼儿系列(十二) Proteus仿真软件简介

    Proteus软件是英国Labcenter electronics公司出版的EDA工具软件.经常使用于单片机等数字电路仿真,分为ISIS和ARES两个程序,前者用于仿真,后者用于设计PCB.我们常使用 ...

  10. 【Android开发经验】来,咱们自己写一个Android的IOC框架!

    到眼下位置.afinal开发框架也是用了好几个月了,还记得第一次使用凝视完毕控件的初始化和事件绑定的时候,当时的心情是多么的兴奋- -代码居然能够这样写!然后随着不断的学习,也慢慢的对IOC框架和注解 ...