SignalR(与Raphael js)$ .connection.hub.start()计时问题

Question

我对javascript的所有复杂性都比较新,所以也许这个时间问题只是我缺乏理解如何为事件处理编写有效的javascript.

我在一个页面上使用了两个SignalR集线器.一个是聊天中心,它可以100%的时间工作.另一个与一些Raphael js对象一起使用,这是我遇到的问题.

我在其中一个raphael圆形对象上有一个click事件,当我在加载屏幕后不久点击它时,我的C#hub方法没有被调用.当发生这种情况时,Chrome开发工具控制台中的错误是"SignalR:必须先启动连接才能发送数据.在.sent()之前调用.start()"始终调用调用hub cs方法的javascript事件.奇怪的是,当我等待几秒钟时,cs hub方法似乎总是按预期工作.这就像加载集线器事件需要几秒钟.有没有其他人遇到过这种情况？

我确实在$(document).ready(function(){...中有我的js代码但是我猜测因为Raphael js对象在js代码运行之前不是dom的一部分,所以它不会强迫它们载入.

$(document).ready(function() {
    var clientHub = $.connection.tableHub;

    var canvas = Raphael((innerWidth / 2) + 83, (innerHeight / 2) - 194, 74, 74);
    var circle1 = seat1Canvas.circle(37, 37, 35);
    var circle1Text = seat1Canvas.text(37, 37, "Open");

    var buildCircleAndSendToClients = function() {
        clientHub.buildCircle(identity.Name);
    };

    var drawAvailableCircle = function() {
        circle1 = seat1Canvas.circle(37, 37, 35);
        circle1Text = seat1Canvas.text(37, 37, "Sit\nHere");
        circle1.attr("fill", "#fffeee");
        circle1.attr("stroke", "black");
        circle1.attr("stroke-width", 3);
        circle1.mousedown(buildCircleAndSendToClients);
    };

    circle1.attr("fill", "#eeefff");
    circle1.attr("stroke", "black");
    circle1.attr("stroke-width", 3);
    circle1.mouseover(drawAvailableCircle);

    clientHub.drawCircle = function(username) {
        circle1 = seat1Canvas.circle(37, 37, 35);
        circle1Text = seat1Canvas.text(37, 37, username);
        circle1.attr("fill", "#eeefff");
        circle1.attr("stroke", "black");
        circle1.attr("stroke-width", 3);
    };

    $.connection.hub.start();
});

Answer 1

您需要将与SignalR连接交互的处理程序的连线移动到您作为参数传递给start方法的回调函数.这将确保处理程序在集线器连接启动之前不处于活动状态.您可能希望稍微更改UI,直到该回调运行,例如,默认情况下禁用按钮,并且只有在处理程序连接后才启用它们.

例如:

$ .connection.hub.start(function(){//连线处理程序并在此处启用UI});