Signalr Owin简单示例javascript客户端未被调用

时间:2013-04-13 19:26:10

标签: signalr signalr-hub signalr.client owin

我有一个5.3.0版本的signalr自托管,正在升级到更新版本的signalr。 使用https://github.com/SignalR/SignalR/wiki/Self-host示例我创建了一个简单的示例,但我无法使其工作。

我可以连接到服务器上的集线器并调用集线器上的方法,但我无法让集线器调用javascript客户端。

当在小提琴手中看到它时,我从来没有看到来自枢纽的响应。

这是代码

using System;
using Microsoft.AspNet.SignalR;
using Microsoft.Owin.Hosting;
using Owin;



namespace ConsoleApplication3
{
class Program
{
    static void Main(string[] args)
    {
        string url = "http://localhost:8080/";

        using (WebApplication.Start<Startup>(url))
        {
            Console.WriteLine("Server running on {0}", url);
            Console.ReadLine();
        }
    }
}
}

using Microsoft.AspNet.SignalR;
using Owin;

namespace ConsoleApplication3
{
  class Startup
  {
    // This method name is important
    public void Configuration(IAppBuilder app)
    {
        var config = new HubConfiguration
        {
            EnableCrossDomain = true,
            EnableJavaScriptProxies = true
        };

        app.MapHubs(config);
    }

  } 

}

using System;
using System.Threading.Tasks;
using Microsoft.AspNet.SignalR;
using Newtonsoft.Json;

namespace ConsoleApplication3.Hubs
{
public class Chat : Hub
{

    public override Task OnConnected()
    {
        Notify(Context.ConnectionId);
        return new Task(() => { });
    }

    public void RunTest()
    {
        Notify(Context.ConnectionId);
    }


    public void Notify(string connectionId)
    {
        dynamic testMessage = new
        {
            Count = 3,
            Message = "Some test message",
            Timestamp = DateTime.Now
        };

        String json = JsonConvert.SerializeObject(testMessage);

        var context = GlobalHost.ConnectionManager.GetHubContext<Chat>();
        context.Clients.Client(connectionId).sendNotification(json);
    }

 }
}

这是客户端

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head>
<title></title>     
    <script src="Scripts/json2.js"></script>
    <script src="Scripts/jquery-1.9.1.js"></script>
    <script src="Scripts/jquery.signalR-1.0.1.js"></script>
    <script src="http://localhost:8080/signalr/hubs"></script>

<script>         
    $(function () {

        // Proxy created on the fly
        var notification = $.connection.chat;
        $.connection.hub.logging = true;

        // Declare functions that can be run on the client by the server
        notification.client.sendNotification = onAddNotification;
        notification.client.disconnected = function (connectionid) {
            console.log(connectionid);
        };
        // Testing code only
        $("#testButton").click(function () {
            // Run test function on server
            notification.server.runTest();
        });

        jQuery.support.cors = true;

        // Map the onConnect and onDisconnect functions
        notification.client.connected = function () {
            alert("Notification system connected");
        };
        notification.client.disconnected = function () { };
        $.connection.hub.url = "http://localhost:8080/signalr";

        //$.connection.hub.start();
        $.connection.hub.start(function () {
            alert("Notification system connected");
        });

    });

    // Process a newly received notification from the server
    function onAddNotification(message) {

        // Convert the passed json message back into an object
        var obj = JSON.parse(message);

        var parsedDate = new Date(parseInt(obj.Timestamp.substr(6)));

        // Update the notification list
        $('#notifications').prepend('<li>' + obj.Message + ' at ' + parsedDate + '</li>');

    };

    </script> 
</head> 
<body>     
    <a href="javascript:void(0)" class="btn" id="testButton">Send test</a>     
    <ul class="unstyled" id="notifications">             
    </ul> 
</body>

任何想法都会受到赞赏,因为我被卡住了。

1 个答案:

答案 0 :(得分:2)

您的代码中很少有东西:

改变这个:

public override Task OnConnected()
{
    Notify(Context.ConnectionId);
    return new Task(() => { });
}

要:

public override Task OnConnected()
{
    Notify(Context.ConnectionId);
    return base.OnConnected();
}

同样在你的中心:

这个功能太过努力了:

public void Notify(string connectionId)
{
    dynamic testMessage = new
    {
        Count = 3,
        Message = "Some test message",
        Timestamp = DateTime.Now
    };

    String json = JsonConvert.SerializeObject(testMessage);

    var context = GlobalHost.ConnectionManager.GetHubContext<Chat>();
    context.Clients.Client(connectionId).sendNotification(json);
}

我甚至不确定你为什么要传递连接ID(也许它是静态的?)

public void Notify()
{
    dynamic testMessage = new
    {
        Count = 3,
        Message = "Some test message",
        Timestamp = DateTime.Now
    };

    Clients.Client(Context.ConnectionId).sendNotification(testMessage);
}

您不需要序列化两次,我们已经为您完成了。

卸下:

jQuery.support.cors = true;

永远不要设置。

此外:

// Map the onConnect and onDisconnect functions
notification.client.connected = function () {
    alert("Notification system connected");
};

notification.client.disconnected = function () { };

这些不是映射任何客户端。您无法将连接和断开连接从服务器映射到客户端。客户有自己的活动。

其他事项:

这应该在开始回调中,这样你就不会在它准备好之前点击它:

$.connection.hub.start().done(function() {
    // Testing code only
    $("#testButton").click(function () {
        // Run test function on server
        notification.server.runTest();
    });
});