How to make a SignalR connection *after* the page loads and reconnect after timeout -
i have been using signalr while in current versions of chrome, ie , ios safari. i've noticed "spinner" indicates page loading continues spin.
we doing further testing , seeing signalr connect running until times out.
/signalr/connect?transport=serversentevents&clientprotocol=1.5&connectiontoken=xxxx&connectiondata="%"5b"%"7b"%"22name"%"22"%"3a"%"22chathub"%"22"%"7d"%"5d&tid=1
in older browsers, looks user if page has not finished loading. moreover, when connect times out, application stops working (or in cases throws error).
i've been able reproduce tutorial ms in both version provided , after upgrading tutorial signalr 2.2.0 , jquery 2.1.3 via nuget
here's link tutorial:
http://www.asp.net/signalr/overview/getting-started/tutorial-getting-started-with-signalr
1) there best practices making connection signalr such connection doesn't hold completion of initial page rendering?
2) best practices handling timeouts/reconnects?
given ms's current tutorial doesn't handle these situations, i'm looking more real world experiences , possibly sample code both scenarios.
here's ms's tutorial starter.
<!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 jquery library. --> <script src="scripts/jquery-2.1.3.min.js"></script> <!--reference signalr library. --> <script src="scripts/jquery.signalr-2.2.0.min.js"></script> <!--reference autogenerated signalr hub script. --> <script src="/signalr/hubs"></script> <!--add script update page , send messages.--> <script type="text/javascript"> $(function () { // declare proxy reference hub. var chat = $.connection.chathub; // create function hub can call broadcast messages. chat.client.broadcastmessage = function (name, message) { // html encode display name , message. var encodedname = $('<div />').text(name).html(); var encodedmsg = $('<div />').text(message).html(); // add message page. $('#discussion').append('<li><strong>' + encodedname + '</strong>: ' + encodedmsg + '</li>'); }; // user name , store prepend messages. $('#displayname').val(prompt('enter name:', '')); // set initial focus message input box. $('#message').focus(); // start connection. $.connection.hub.start().done(function () { $('#sendmessage').click(function () { // call send method on hub. chat.server.send($('#displayname').val(), $('#message').val()); // clear text box , reset focus next comment. $('#message').val('').focus(); }); }); }); </script> </body> </html>
Comments
Post a Comment