不用找了,比较全的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. configure.ac:20: error: Autoconf version 2.65 or higher is required

    安装thrift例如,下面的问题出现: configure.ac:20: error: Autoconf version 2.65 or higher is required wget http:// ...

  2. 了解ASP.NET5 Web应用程序结构

    本文参考ASP.NET5 官方文档 Understanding ASP.NET 5 Web Apps,加入了一些个人理解,理解不对的地方希望大家能指出,互相学习. ASP.NET 5 针对WEB编程引 ...

  3. sql 中获取最后生成的标识值 IDENT_CURRENT ，@@IDENTITY ，SCOPE_IDENTITY 的用法和区别

    原文:sql 中获取最后生成的标识值 IDENT_CURRENT ,@@IDENTITY ,SCOPE_IDENTITY 的用法和区别 IDENT_CURRENT 返回为任何会话和任何作用域中的指定表 ...

  4. php阅读csv文件类

    php处理csv文件类: http://www.php100.com/cover/php/540.html <?php define("CSV_Start", 0); def ...

  5. [原] Jenkins Android 自动打包配置（转）

    一.Jenkins自动打包配置 目标:1. 自动打包:2. 自动上传:3. 友好下载 1. Jenkins简介 Jenkins是基于Java开发的一种持续集成工具,用于监控持续重复的工作. 减少重复劳 ...

  6. [Java Web]Struts2加起来(一个)

    Struts2环境配置 进口Struts2的需要jar包 在WEB-INF/classes(src)文件夹下创建struts.xml文件 在web.xml文件里加入Struts过滤器信息 经常使用配置 ...

  7. BizTalk开发小技巧

    BizTalk开发小技巧 随笔分类 - Biztalk Biztalk 使用BizTalk实现RosettaNet B2B So Easy 摘要: 使用BizTalk实现RosettaNet B2B ...

  8. ext3文件系统反删除利器ext3grep应用实战

    推荐:10年技术力作:<高性能Linuxserver构建实战Ⅱ>全网发行,附试读章节和全书实例源代码下载! 一."rm –rf"带来的困惑 国外一份非常著名的Linux ...

  9. 左右 Java 于 finally 深度分析语句块

    首先,让我们来问你一个问题:finally 声明块将运行? 很多人认为 finally 语句块是一定要运行.其中还包括了一些非常有经验的 Java 程序猿.不幸的是,没有像很多像人们想象,对于这个问题 ...

  10. HDU1160(LIS)

    主题链接:http://acm.hdu.edu.cn/showproblem.php?pid=1160 题意:求体重下降.速度添加的样例最多有多少个 依据体重降序排一下,然后求速度的最长上升子序列 , ...