使用SignalR将消息从代码推送到客户端

时间:2014-06-13 12:21:20

标签: c# asp.net signalr

我从excel电子表格导入记录。我想用每条记录的进度更新客户端屏幕。我被告知SignalR是未来的发展方向。

我已经开始使用ChatHub示例并将其剥离了一下。

编辑... 似乎broadcastMessage函数正在运行,但表现得很奇怪。以下是有关正在发生的事情的简短视频:https://www.youtube.com/watch?v=wRqiyaQ2hD0

ASPX页面

<form id="form2" runat="server">

    <ul id="progressReport"></ul>

    <asp:Button Text="Push message" ID="btn" OnClick="btn_Click" runat="server" />

    <!--Script references. -->
    <!--Reference the jQuery library. -->
    <script src="Scripts/jquery-1.8.2.min.js"></script>
    <!--Reference the SignalR library. -->
    <script src="Scripts/jquery.signalR-2.0.3.min.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.chatHub;
            // Create a function that the hub can call to broadcast messages.
            chat.client.broadcastMessage = function (name, message) {
                // Html encode display name and message. 
                var encodedName = $('<div />').text(name).html();
                var encodedMsg = $('<div />').text(message).html();
                // Add the message to the page. 
                $('#progressReport').append('<li><strong>' + encodedName
                    + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
            };

            // Start the connection.
            $.connection.hub.start().done(function () {
                chat.server.send($('#displayname').val(), $('#message').val());
            });
        });
    </script>
</form>

ASPX.CS

using SignalRChat;
using System;

namespace SignalR_Test
{
    public partial class form2 : System.Web.UI.Page
    {
        protected void btn_Click(object sender, EventArgs e)
        {
            ChatHub ch = new ChatHub();
            for ( int i = 0; i <= 10; i++)
            {
                ch.Send("Code Behind", i +" has been imported");
            }
        }
    }
}

ChatHub.CS

using Microsoft.AspNet.SignalR;
namespace SignalRChat
{
    public class ChatHub : Hub
    {
        public void Send(string name, string message)
        {
            var context = GlobalHost.ConnectionManager.GetHubContext<ChatHub>();
            // Call the broadcastMessage method to update clients.
            context.Clients.All.broadcastMessage(name, message);
        }
    }
}

2 个答案:

答案 0 :(得分:2)

尝试将此添加到您的aspx页面并检查它是否在javascript控制台中记录调用:

$.connection.hub.logging = true;
$.connection.hub.start();

您的班级名为ChatHub,您在客户端执行connection.chatHub(注意小写c vs大写)。尝试在HubName类中添加Hub属性:

[HubName("chatHub")]
public class ChatHub : Hub

另外,尝试将~/添加到脚本src:

<script src="~/signalr/hubs"></script>

答案 1 :(得分:0)

您是否缺少必修Startup课程?请参见示例here

JS脚本版本(jquery.signalR-2.0.3.min.js,jquery-1.8.2.min.js)与脚本中的脚本相匹配&#39; Scripts&#39; ?目录