SignalR可以与asp.net WebForms一起使用吗?

Vik*_*ana 13 asp.net visual-studio-2010 signalr real-time-updates

我想SignalR在我的项目中使用实时更新.

我的项目是在开发的WebForms.

我搜索了3,4天,但我找到的只是MVC的例子.谁有人建议解决方案?

obj*_*und 18

@Stephen提供的答案现已过时,因为它不适用于最新版本的SignalR(v2.2.0).此外,还有一些其他未提及的内容,恕我直言可能会帮助未来的读者快速使用Good old Webforms框架开始使用SignalR.解决方案可能看起来乏味,但事实并非如此.我希望它可以帮助访问此页面的人希望获得SignalR for Webforms的帮助.

预先要求:( 我使用的版本在括号内).我没有在其他版本上测试过此解决方案

  1. MS Visual Studio 2015/2013.(2015)在Win-7 x64上
  2. .Net FrameWork 4.5或更高版本(4.5.2)
  3. NuGet的SignalR 2.2.0版(发布日期01/13/2015)
  4. jQuery ver 1.6.4
  5. Owin v1.0.0和其他一些像Json,owin.Security等...(参见packages.config)
  6. IIS v7.0及更高版本.适用于VS2015附带的IIS Express 10.0版.

步骤:

按照以下步骤使SignalR在WebForms项目中工作.该项目的目标是使用SignalR定期向所有连接的客户端(浏览器会话)广播时间戳.只有第一个时间戳由代码隐藏文件中的服务器端代码生成.Rest来自SignalR HubClass,它负责定期生成时间戳,并将它们bradcast到所有连接的会话.

  1. 在Visual Studio(2015)中创建一个空的WebForms项目.(选择空模板并检查"添加核心库和文件夹"下的WebForms.)假设我们将其命名为"SignalR_WebForms".
  2. 下载,安装和添加对SignalR + jQuery + Owin库的引用

    2A.工具 - > NuGet包管理器 - >管理解决方案的Nuget包.

    2B.在搜索中键入"Microsoft.ASPNet.SignalR"并选择"Microsoft.ASPNet.SignalR"(服务器组件).

    2C.在右侧面板上现在选中"SignalR_WebForms"旁边的框.这将启用"安装"按钮.选择最新版本(截至今天的2.2.0),然后单击"安装"按钮.这将弹出一个"查看更改"对话框,通知您将安装的所有软件包(共10个).单击确定.然后单击"接受"以接受许可条款.这将开始下载和安装过程(非常快).完成后打开Packages.config文件(位于proj文件夹的根目录下),它应如下所示:

`

<-- Packages.config should look like this  -->

<?xml version="1.0" encoding="utf-8"?>
    <packages>
      <package id="jQuery" version="1.6.4" targetFramework="net452" />
      <package id="Microsoft.AspNet.SignalR" version="2.2.0" targetFramework="net452" />
      <package id="Microsoft.AspNet.SignalR.Core" version="2.2.0" targetFramework="net452" />
      <package id="Microsoft.AspNet.SignalR.JS" version="2.2.0" targetFramework="net452" />
      <package id="Microsoft.AspNet.SignalR.SystemWeb" version="2.2.0" targetFramework="net452" />
      <package id="Microsoft.CodeDom.Providers.DotNetCompilerPlatform" version="1.0.0" targetFramework="net452" />
      <package id="Microsoft.Net.Compilers" version="1.0.0" targetFramework="net452" developmentDependency="true" />
      <package id="Microsoft.Owin" version="2.1.0" targetFramework="net452" />
      <package id="Microsoft.Owin.Host.SystemWeb" version="2.1.0" targetFramework="net452" />
      <package id="Microsoft.Owin.Security" version="2.1.0" targetFramework="net452" />
      <package id="Newtonsoft.Json" version="6.0.4" targetFramework="net452" />
      <package id="Owin" version="1.0" targetFramework="net452" />
</packages>
Run Code Online (Sandbox Code Playgroud)

`

  1. 添加一个webform并将其命名为default.aspx(右键单击Proj Add - > Webform - >键入default.aspx - >单击确定.

  2. 将此代码复制粘贴到default.aspx文件中(标记)

`

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="default.aspx.cs" Inherits="SignalR_WebForms._default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>SignalR Using webForms</title>

    <script src="Scripts/jquery-1.6.4.js"></script>
    <script src="Scripts/jquery.signalR-2.2.0.js"></script>
    <script src="signalr/hubs"></script>


    <script type="text/javascript">

        $(function() {

            var logger = $.connection.logHub;

            logger.client.logMessage = function(msg) {

                $("#logUl").append("<li>" + msg + "</li>");

            };

            $.connection.hub.start();

        });

    </script>

</head>
<body>
    <form id="form1" runat="server">
    <div>

    <h3>Log Items</h3>
    <asp:listview id="logListView" runat="server" itemplaceholderid="itemPlaceHolder" clientidmode="Static" enableviewstate="false">
        <layouttemplate>
            <ul id="logUl">
                <li runat="server" id="itemPlaceHolder"></li>
            </ul>
        </layouttemplate>
        <itemtemplate>
                <li><span class="logItem"><%#Container.DataItem.ToString() %></span></li>
        </itemtemplate>
    </asp:listview>



    </div>



    </form>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

`

  1. 将以下代码复制粘贴到代码隐藏文件中(default.aspx.cs)

`

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace SignalR_WebForms
{
    public partial class _default : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            var myLog = new List<string>();
            myLog.Add(string.Format("{0} - Logging Started", DateTime.UtcNow));

            logListView.DataSource = myLog;
            logListView.DataBind();
        }
    }
}

`
Run Code Online (Sandbox Code Playgroud)
  1. 将App_Code文件夹添加到项目中.(右键单击Proj - >添加 - >添加ASP.Net文件夹 - >选择App_Code).

  2. 添加一个SignalR Hub类并将其命名为LogHub.cs要执行此操作右键单击App_Code文件夹 - >添加 - >选择类..(在列表底部) - >单击Vsual C#然后Web然后SignalR - >选择SignalR HubClass - >键入LogHub.cs作为文件名.点击确定.

  3. 打开LogHub.cs类文件并删除现有代码并将下面的粘贴代码复制到其中.保存.

`

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using Microsoft.AspNet.SignalR;

namespace SignalR_WebForms.App_Code
{
    public class LogHub : Hub
    {
        public static readonly System.Timers.Timer _Timer = new System.Timers.Timer();

        static LogHub()
        {
            _Timer.Interval = 5000;
            _Timer.Elapsed += TimerElapsed;
            _Timer.Start();
        }

        static void TimerElapsed(object sender, System.Timers.ElapsedEventArgs e)
        {
            var hub = GlobalHost.ConnectionManager.GetHubContext("LogHub");
            hub.Clients.All.logMessage(string.Format("{0} - Still running", DateTime.UtcNow));
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

`

  1. 添加Owin启动类文件并将其命名为Startup1.cs.(右键单击App_code - > Add - > Class - >单击Vsual C#,然后单击Web,然后单击General - > Pick Owin Startup类.)删除现有代码并将下面的粘贴代码复制到此类文件中.保存.

    `

    using System;
    using System.Threading.Tasks;
    using Microsoft.Owin;
    using Owin;
    
    [assembly: OwinStartup(typeof(WebApplication1.App_Code.Startup1))]
    
    namespace WebApplication1.App_Code
    {
        public class Startup1
        {
            public void Configuration(IAppBuilder app)
            {
                app.MapSignalR();
            }
        }
    }
    
    Run Code Online (Sandbox Code Playgroud)

`

  1. 构建并运行Proj(F5).如果没有错误,您应该在本地浏览器上看到以下输出.

`

Log Items
•06/04/2016 09:50:02 PM - Logging Started
•06/04/2016 09:50:06 PM - Still running
•06/04/2016 09:50:11 PM - Still running
•06/04/2016 09:50:16 PM - Still running
•06/04/2016 09:50:21 PM - Still running
.....
.....
.....
.....
Keeps Going **without** having to refresh the Browser.
Run Code Online (Sandbox Code Playgroud)

`

  1. 从远程PC访问同一站点,您应该获得完全相同的时间戳.这将验证网站是否按预期工作.

  2. 要进一步验证右键单击浏览器并单击"查看源".在IE上,这将打开一个带有页面html的记事本窗口.找到"logUL",您应该只看到显示初始时间戳的标记.没有标记显示SignalR集线器注入的剩余更新.这与AJAX类似.

`

<div>
<h3>Log Items</h3>
        <ul id="logUl">

            <li><span class="logItem">06/04/2016 09:50:02 PM - Logging Started</span></li>

        </ul>

</div>
Run Code Online (Sandbox Code Playgroud)

`

而已 !.HTH !!


Ste*_*hen 17

您可以将SignalR与webforms一起使用.请参阅下面从本教程的例子在这里

  1. 创建一个面向.NET Framework 4.5或更高版本的新ASP.NET WebForms项目

  2. 更改主页以包含以下内容

    <asp:content runat="server" id="BodyContent" contentplaceholderid="MainContent">
    
    
        <h3>Log Items</h3>
        <asp:listview id="logListView" runat="server" itemplaceholderid="itemPlaceHolder" clientidmode="Static" enableviewstate="false">
            <layouttemplate>
                <ul id="logUl">
                    <li runat="server" id="itemPlaceHolder"></li>
                </ul>
            </layouttemplate>
            <itemtemplate>
                <li><span class="logItem"><%#Container.DataItem.ToString() %></span></li>
            </itemtemplate>
        </asp:listview>
    
    </asp:content>
    
    Run Code Online (Sandbox Code Playgroud)
  3. 编辑default.aspx.cs代码隐藏文件以包含以下事件

    protected void Page_Load(object sender, EventArgs e)
    {
    
        var myLog = new List<string>();
        myLog.Add(string.Format("{0} - Logging Started", DateTime.UtcNow));
    
        logListView.DataSource = myLog;
        logListView.DataBind();
    
    }
    
    Run Code Online (Sandbox Code Playgroud)
  4. 通过NuGet添加SignalR包.(尝试搜索"Microsoft ASP.Net SignalR JS"和"Microsoft ASP.Net SignalR JS")

  5. 创建一个Hub类

    public class LogHub : Hub
    {
    
        public static readonly System.Timers.Timer _Timer = new System.Timers.Timer();
    
        static LogHub()
        {
            _Timer.Interval = 2000;
            _Timer.Elapsed += TimerElapsed;
            _Timer.Start();
        }
    
        static void TimerElapsed(object sender, System.Timers.ElapsedEventArgs e)
        {
            var hub = GlobalHost.ConnectionManager.GetHubContext("LogHub");
            hub.Clients.All.logMessage(string.Format("{0} - Still running", DateTime.UtcNow));
        }
    
    }
    
    Run Code Online (Sandbox Code Playgroud)
  6. 在页面底部设置以下脚本块(您的jquery和jquery.signalr版本可能会有所不同)

    <script src="Scripts/jquery.1.7.1.min.js"></script>
    <script src="Scripts/jquery.signalR-1.0.0-rc1.min.js"></script>
    <script src="http://www.codeproject.com/signalr/hubs" type="text/javascript"></script>
    <script type="text/javascript">
    
        $(function() {
    
            var logger = $.connection.logHub;
    
            logger.client.logMessage = function(msg) {
    
                $("#logUl").append("<li>" + msg + "</li>");
    
            };
    
            $.connection.hub.start();
    
        });
    
    </script>
    
    Run Code Online (Sandbox Code Playgroud)
  7. 将以下内容添加到global.asax.cs中的Application_Start事件处理程序中

    void Application_Start(object sender, EventArgs e)
    {
        RouteTable.Routes.MapHubs();
    }
    
    Run Code Online (Sandbox Code Playgroud)