如何在页面加载后进行SignalR连接*并在超时后重新连接

时间:2015-03-20 19:06:03

标签: signalr

我在当前版本的chrome,IE和iOS Safari中使用SignalR已经有一段时间了。我一直注意到,指示页面正在加载的“微调器”继续旋转。

我们正在进行一些进一步的测试,看到signalR connect正在运行,直到它超时。

/signalr/connect?transport=serverSentEvents&clientProtocol=1.5&connectionToken=XXXX&connectionData = “%” 5B “%” 7B “%” 22name “%” 22 “%” 3A “%” 22chathub “%” 22 “%” 7D “%” 5D&安培; TID = 1

在旧版浏览器中,这会向用户显示该页面尚未完成加载。此外,当连接最终超时时,应用程序只是停止工作(或者在某些情况下会引发错误)。

我已经能够在提供的版本中以及通过Nuget将教程升级到SignalR 2.2.0和jQuery 2.1.3之后使用MS的教程重现这一点

以下是教程的链接:

http://www.asp.net/signalr/overview/getting-started/tutorial-getting-started-with-signalr

1)是否有与signalR建立连接的最佳实践,以便连接不会阻止初始页面呈现的完成?

2)处理超时/重新连接的最佳做法如何?

鉴于MS当前的教程没有处理这些情况,我正在寻找更多真实世界的经验以及两种情景下的示例代码。

这是MS的初学教程。

 <!DOCTYPE html>
 <html>
 <head>
     <title>SignalR Simple Chat</title>
     <style type="text/css">
         .container {
             background-color: #99CCFF;
             border: thick solid #808080;
             padding: 20px;
             margin: 20px;
         }
     </style>
 </head>
 <body>
     <div class="container">
         <input type="text" id="message" />
         <input type="button" id="sendmessage" value="Send" />
         <input type="hidden" id="displayname" />
         <ul id="discussion"></ul>
     </div>
     <!--Script references. -->
     <!--Reference the jQuery library. -->
     <script src="Scripts/jquery-2.1.3.min.js"></script>
     <!--Reference the SignalR library. -->
     <script src="Scripts/jquery.signalR-2.2.0.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.
                 $('#discussion').append('<li><strong>' + encodedName
                     + '</strong>:&nbsp;&nbsp;' + encodedMsg + '</li>');
             };
             // Get the user name and store it to prepend to messages.
             $('#displayname').val(prompt('Enter your name:', ''));
             // Set initial focus to message input box.
             $('#message').focus();
             // Start the connection.
             $.connection.hub.start().done(function () {
                 $('#sendmessage').click(function () {
                     // Call the Send method on the hub.
                     chat.server.send($('#displayname').val(),      $('#message').val());
                     // Clear text box and reset focus for next comment.
                     $('#message').val('').focus();
                 });
             });
         });
     </script>
 </body>
 </html>

0 个答案:

没有答案