Javascript 信号器启动暴露文档“就绪”处理程序中的时间间隔

Javascript 信号器启动暴露文档“就绪”处理程序中的时间间隔,javascript,jquery,asp.net,asp.net-mvc,signalr,Javascript,Jquery,Asp.net,Asp.net Mvc,Signalr,在中,我描述了连接SignalR应用程序时遇到的问题,该应用程序允许POST控制器操作回调触发POST的特定客户端。我实现的解决方案包括在连接好信号器之后,在JavaScript中获取信号器连接ID,并将该连接ID存储在隐藏的表单字段中。当用户单击表单上的submit按钮时,该隐藏表单字段将被发送到POST操作 该方案的明显问题是,信号器建立连接需要几秒钟的时间;如果用户在此期间单击submit按钮,那么POST操作会为连接ID获取一个空字符串。好的,我认为这是一个简单的解决方案:在表单加载时禁

在中,我描述了连接SignalR应用程序时遇到的问题,该应用程序允许POST控制器操作回调触发POST的特定客户端。我实现的解决方案包括在连接好信号器之后,在JavaScript中获取信号器连接ID,并将该连接ID存储在隐藏的表单字段中。当用户单击表单上的submit按钮时,该隐藏表单字段将被发送到POST操作

该方案的明显问题是,信号器建立连接需要几秒钟的时间;如果用户在此期间单击submit按钮,那么POST操作会为连接ID获取一个空字符串。好的,我认为这是一个简单的解决方案:在表单加载时禁用submit按钮,并在连接建立后重新启用它。注意,如果用户浏览器中禁用JavaScript,HTML必须以启用按钮开始;只有在启用了JS的情况下,我才能使用JS来禁用按钮

但我的问题就在这里:至少在IE 11中:引用自动生成的SignalR hub脚本会在浏览器显示页面并允许用户单击按钮和页面就绪脚本运行之间造成大约两秒钟的延迟。在这两秒钟的窗口中,用户可以单击submit按钮并向POST操作发送空连接ID

我的观点是这样的。请注意,这一行:

    <!-- Reference the autogenerated SignalR hub script. -->
    <script src="~/signalr/hubs"></script>
使页面在页面就绪脚本执行之前显示几秒钟

@model SignalRTest.Models.MyViewModel

@using (Html.BeginForm()) {
    @Html.HiddenFor(m => m.SignalRConnectionId)
    <button type="submit" class="btn btn-primary">Go to it!</button>
}

<div id="hidden-msg" hidden="hidden">
    <p>Please wait...</p>
</div>

@section scripts {
    <!-- Reference the SignalR library. -->
    <script src="~/Scripts/jquery.signalR-2.1.2.min.js"></script>

    <!-- Reference the autogenerated SignalR hub script. -->
    <script src="~/signalr/hubs"></script>

    <!-- SignalR script to update the page -->
    <script>
        $(document).ready(function () {
            // Disable the submit buttons (until we have a connection ID)
            $('input[type="submit"], button[type="submit"]')
                .prop('disabled', true)
                .attr('data-sbs-enable-me', '');

            // Get a reference to the server "hub" class (camelCase)
            var hub = $.connection.myHub;

            // Create a function that the hub can call
            hub.client.myCallback = function () {
                $('#hidden-msg').show();
            };

            // Start the connection.
            $.connection.hub.start()
                .done(function () {
                    // Get our connection ID and store it in a hidden field so that it is
                    // sent to the POST action
                    $('#@Html.IdFor(m => m.SignalRConnectionId)')
                        .attr('value', $.connection.hub.id);

                    // Enable the buttons
                    $('[data-sbs-enable-me]')
                        .prop('disabled', false)
                        .removeAttr('data-sbs-enable-me');
                })

                .fail(function () { });
        });
    </script>
}

尝试在不使用SignalR hub生成的hub代理脚本的情况下进行连接

@section scripts {
<!-- Reference the SignalR library. -->
<script src="~/Scripts/jquery.signalR-2.1.2.min.js"></script>

<!-- SignalR script to update the page -->
<script>
    $(document).ready(function () {
        // Disable the submit buttons (until we have a connection ID)
        $('input[type="submit"], button[type="submit"]')
            .prop('disabled', true)
            .attr('data-sbs-enable-me', '');

        // Get a reference to the server "hub" class (camelCase)
        var connection = $.hubConnection();
        var myHubProxy = connection.createHubProxy('myHub');

        // Create a function that the hub can call
        myHubProxy.on('myCallback', function() {
            $("#hidden-msg').show();
        });

        // Start the connection.
        connection.start()
            .done(function () {
                // Get our connection ID and store it in a hidden field so that it is
                // sent to the POST action
                $('#@Html.IdFor(m => m.SignalRConnectionId)')
                    .attr('value', connection.id);

                // Enable the buttons
                $('[data-sbs-enable-me]')
                    .prop('disabled', false)
                    .removeAttr('data-sbs-enable-me');
            })

            .fail(function () { });
    });
</script>
}

可以找到信号器客户端配置的文档。它概述了如何使用生成的代理和不使用生成的代理进行设置。我唯一一次使用gerated代理是在处理POC时。但通常我会将集线器设置为不广播生成的脚本,这样外部世界就看不到它。

谢谢GJohn。我不得不对你的答案稍加修改才能使它生效。我用connection替换了对$.connection.hub的两个引用,并在.on函数后添加了一个缺少的括号。我还补充了一些意见。我的编辑正在等待同行审查。啊,是的,很抱歉,一旦你不再使用生成的代理,开始方法就有点不同了。