.NET 4.0下使用 SignalR

 

项目:ASP.NET MVC 4 Web 应用程序

开发环境:VS2012

目标框架:.NET Framework 4

 

SignalR 主要是用于消息推送的一个框架

SignalR是什么 http://www.cnblogs.com/humble/p/3850749.html

最好的入门文章 应该是 http://www.asp.net/signalr/overview/getting-started/introduction-to-signalr  简单明了

安装时遇到的 http://www.cnblogs.com/ding2011/p/3468740.html

 

 

 

 

 

安装

工具 -> 库程序包管理器 -> 程序包管理器控制台

输入下面命令 install-package Microsoft.AspNet.SignalR -Version 1.1.4

因为是 .net 4.0 用不了 SignalR 2以上的版本

安装完毕发现项目多了一个Script 文件夹

主要用到 jquery-1.6.4.min.js和jquery.signalR-1.1.4.min.js,其他可以删除

 

 

 

 

 

BaseController.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

//工具 -> 库程序包管理器 -> 程序包管理器控制台 输入下面命令
//install-package Microsoft.AspNet.SignalR -Version 1.1.4
using Microsoft.AspNet.SignalR;

namespace SignalR.Controllers
{

    //所有 hub
    public class AllHub : Hub
    {

    }

    //当前 hub
    public class CurHub : Hub
    {
        public void SetRecGroup(string id)//设置接收组
        {
            this.Groups.Add(this.Context.ConnectionId, id);
        }
    }

    public class BaseController : Controller
    {

        public ActionResult ProgressBar()
        {
            return View();
        }

        public ActionResult Broadcast()
        {
            return View();
        }

        //进度条
         public void fnProgressBar()
        {
            for (int i = 0; i < 100; i++)
            {
                IHubContext chat = GlobalHost.ConnectionManager.GetHubContext<CurHub>();
                chat.Clients.Group("clientId").notify(i);//向指定组发送
                System.Threading.Thread.Sleep(100);
            }
        }

        //广播
         public string fnBroadcast(string msg)
        {
            string result = "发送失败!";
            try
            {
                IHubContext chat = GlobalHost.ConnectionManager.GetHubContext<AllHub>();
                chat.Clients.All.notice(msg);//向所有组发送
                result = "发送成功!";
            }
            catch (Exception e)
            {
                result = "发送失败!\n失败原因:\n" + e.Message;
            }
            return result;
        }

    }
}


 

 

 

 

Global.asax.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Http;
using System.Web.Mvc;
using System.Web.Routing;

namespace SignalR
{
    // Note: For instructions on enabling IIS6 or IIS7 classic mode, 
    // visit http://go.microsoft.com/?LinkId=9394801
    public class MvcApplication : System.Web.HttpApplication
    {
        protected void Application_Start()
        {
            //添加 SignalR 映射
              //注意执行顺序  放在最后面 会失败
              //不添加  <script src="~/signalr/hubs"></script> 会生成失败
              RouteTable.Routes.MapHubs();

            AreaRegistration.RegisterAllAreas();

            WebApiConfig.Register(GlobalConfiguration.Configuration);
            FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);
            RouteConfig.RegisterRoutes(RouteTable.Routes);
        }
    }
}


 

 

 

 

Broadcast.cshtml

<!DOCTYPE html>

<html>
    <head runat="server">
        <title>消息推送页面</title>
        <script src="~/Scripts/jquery-1.6.4.min.js"></script>
        <script src="~/Scripts/jquery.signalR-1.1.4.min.js"></script>
        <script src="~/signalr/hubs"></script>
    </head>
    <body>
        <input type="text" id="txtMess"/>
        <input type="button" value="发送广播消息" id="btnPush"/>

        <script>
            (function () {

                //发送信息
                $("#btnPush").click(function () {
                    var $mess = $("#txtMess");
                    $.ajax({
                        url: "../Base/fnBroadcast",
                        data: { msg: $mess.val() },
                        type: "post",
                        dataType: "text",
                        success: function (result) {
                            if (result.indexOf("成功") !== -1) {
                                $mess.val("");
                            }
                            else {
                                alert(result);
                            }
                        }
                    });
                });

                //接收信息
                var allHub = $.connection.allHub;//对应后台的 类 AllHub
                allHub.client.notice = function (msg) {
                    $("body").append("<br/><br/>" + msg);
                }
                $.connection.hub.start();

            })();
        </script>
    </body>
</html>


 

 

 

 

ProgressBar.cshtml

<!DOCTYPE html>

<html>
    <head runat="server">
        <title>进度条</title>
        <script src="~/Scripts/jquery-1.6.4.min.js"></script>
        <script src="~/Scripts/jquery.signalR-1.1.4.min.js"></script>
        <script src="~/signalr/hubs"></script>
    </head>
    <body>
        <div id="loading" style="width: 0%;">Loading</div>
        <input id="submit" type="button" value="Start" />

        <script>
            (function () {

                //接收信息
                var curHub = $.connection.curHub;//对应后台的类CurHub
                curHub.client.notify = function (msg) {
                    $("#loading").css({ "background-color": "blue", "width": Number(msg) + "%" });
                };
                $.connection.hub.start().done(function () {
                    curHub.server.setRecGroup("clientId");//设置接收组,该方法对应后台的类CurHub的SetRecGroup
                });

                $("#submit").click(function () {
                    $.get("../Base/fnProgressBar", function () { });
                });

            })();
        </script>
    </body>
</html>

 

 

 

 

注意

<script src="~/signalr/hubs"></script> 这个js文件是动态生成的,项目里面是找不到该文件的

要确保 动态生成成功 必须在 Global.asax.cs 添加 映射 具体查看上面的 Global.asax.cs

©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页