SignalR 可以与 asp.net WebForms 一起使用吗？答案

【问题标题】：Can SignalR be used with asp.net WebForms?SignalR 可以与 asp.net WebForms 一起使用吗？
【发布时间】：2013-08-09 09:31:16
【问题描述】：

我想在我的项目中使用SignalR 进行实时更新。

我的项目是在WebForms 开发的。

我搜索了 3,4 天，但我发现的都是 MVC 示例。任何人都可以提出解决方案吗？

【问题讨论】：

标签： asp.net visual-studio-2010 signalr real-time-updates

【解决方案1】：

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

前置要求： （我使用的版本在括号中）。我未在其他版本上测试过此解决方案

MS Visual Studio 2015/2013。 (2015) 在 Win-7 x64 上
.Net FrameWork 4.5 或更高版本 (4.5.2)
来自 NuGet 的 SignalR 版本 2.2.0（发布日期 01/13/2015）
jQuery 版本 1.6.4
Owin v1.0.0 以及 Json、owin.Security 等少数其他...（请参阅 packages.config）
IIS v7.0 及更高版本。适用于 VS2015 附带的 IIS Express 10.0 版。

步骤：

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

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

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

2b。在搜索中输入“Microsoft.ASPNet.SignalR”并选择“Microsoft.ASPNet.SignalR”（服务器组件）。

2c。在右侧面板现在选中“SignalR_WebForms”旁边的框。这将启用“安装”按钮。选择最新版本（截至今天为 2.2.0）并单击安装按钮。这将弹出一个“Review Changes”对话框，通知您将安装的所有包（共 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>

添加一个webform并命名为default.aspx（右键Proj Add --> Webform --> type default.aspx -->点击ok。
将此代码复制粘贴到 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>

将下面的代码复制粘贴到代码隐藏文件（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();
        }
    }
}

`

将 App_Code 文件夹添加到项目中。（右键单击 Proj --> 添加 --> 添加 ASP.Net 文件夹 --> 选择 App_Code ）。
添加一个 SignalR Hub 类并将其命名为 LogHub.cs 要执行此操作右键单击 App_Code 文件夹 --> 添加 --> 选择类 ..（在列表底部） --> 单击Vsual C# 然后 Web 然后 SignalR --> Pick SignalR HubClass --> 输入 LogHub.cs 作为文件名。点击确定。
打开 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));
        }
    }
}

添加一个 Owin 启动类文件并将其命名为 Startup1.cs。（右键单击 App_code --> 添加 --> 类 --> 单击 Vsual C# 然后 Web 然后 General --> 选择 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();
        }
    }
}

构建并运行项目 (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.

从远程 PC 访问同一站点，您应该获得完全相同的时间戳。这将验证该网站是否按预期工作。
进一步验证右键单击浏览器并单击查看源代码。在 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>

就是这样！ HTH !!

【讨论】：

感谢您为您提供详细的答案+1
嗨，这个的代码是什么？，在您的说明中，您没有提到创建信号器文件夹。
@GustiArya 添加 nuget 包 Microsoft.AspNet.SignalR.SystemWeb
如果没有一个客户端是浏览器怎么办？我应该将客户端指向哪个 url 以获取消息？
@The Berga 对不起，我不能说...我早就转向其他技术堆栈，目前我什至没有带有 Visual Studio 的 PC 来检查这个:(。天哪，它已经 4自从我写了这个答案以来已经 + 年了。人确实时间飞逝或什么！！但只要看看我的答案，它将是您将在第 11 步中使用的任何 url。要找出这一点，您需要构建项目并在其中运行它VS，它会在浏览器中打开，通常带有 localhost:port/something 有点 url（如果是这样）用 Visual Studio PC 的主机名替换 localhost，这将是指向的远程 url。

【解决方案2】：

您可以将 SignalR 与网络表单一起使用。请参阅下面的教程中的示例here

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

更改主页以包含以下内容

<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>

编辑 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();

}

通过 NuGet 添加 SignalR 包。（尝试搜索“Microsoft ASP.Net SignalR JS”和“Microsoft ASP.Net SignalR JS”）

创建一个 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));
    }

}

在页面底部设置以下脚本块（您的 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>

将以下内容添加到 global.asax.cs 中的 Application_Start 事件处理程序

void Application_Start(object sender, EventArgs e)
{
    RouteTable.Routes.MapHubs();
}

【讨论】：

斯蒂芬感谢链接。但它在 Globel.asax 中显示错误，（Bundleconfig 在当前上下文中不存在，Authcnfig 在当前上下文中不存在）
我再次遇到错误 System.Web.Routing.RouteCollection 不包含 MapHubs 的定义
你安装了 SignalR 包吗？
是的，先生，我安装了 SignalR 完整包，你能告诉我 MapHub 包含在哪个程序集文件中
编辑了答案（无需将“~/signalr”传递给 MapHubs 方法

【解决方案3】：

在包管理器控制台中输入：

install-package Microsoft.AspNet.SignalR -Version 1.1.3

【讨论】：