“websocket was interrupted while page is loading” on Firefox for Socket.io

Question

Error: The connection to  was interrupted while the page was loading.
Source File: localhost/socket.io/node_modules/socket.io-client/dist/socket.io.         


        

Answer 1

One solution is to put a timeout on the disconnect event.

         setTimeout(() => {
            $('#offlineModal').modal('show')
          }, 5000)

Answer 2

It happens because, you are not closing your open websocket.

This code would remove this error:

$(window).on('beforeunload', function(){
    socket.close();
});

Answer 3

I've had this problem with our custom Undertow-based webserver for years -- my problem was that my server was not responding to the socket close message.

Based on a comment by Jan Wielemaker I checked my socket close handler code for AbstractReceiveListener.onFullCloseMessage and realized I had not called the super method. After adding super.close() the socket closes cleanly on the client and no error is emitted.

Answer 4

I was just running through the Socket.IO tutorials and I ran into this exact problem. I tried the posted solutions but they didn't seem to work at all.

After some fiddling and some screaming and some rubber-ducking, I finally figured out what the issue was. The issue is that it's trying to connect to the socket before the socket variables have been properly initialized. Javascript boo boo #1.

If you will ammend your file to include jQuery and then wrap your functions like so:

    <script src="/socket.io/socket.io.js"></script>
    <script src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
	<script>
    $(function(){
      var socket = io.connect('http://localhost:8080');

      socket.on('news', function (data) {
        alert(JSON.stringify(data));
        console.log(data);
        socket.emit('my next event', { my: 'data' });
      });	
    });
    </script>

You will have much more success.

Answer 5

What impact does this have on your application? My guess is that it's just not great to see an error in the console.

The problem here is that you are seeing Firefox loggin this error and there's nothing you can do about it. It's not possible to capture this error with a try...catch block or via websocket.onerror/websocket.onclose.

See: How do I catch a WebSocket connection interruption?

Related:

• Should WebSocket.onclose be triggered by user navigation or refresh?
• Firefox - Race condition allows ghost WebSocket connections to live after tab closed

Answer 6

This seems to be an open bug in Firefox (as of 2015-03-29):

https://bugzilla.mozilla.org/show_bug.cgi?id=712329

The workaround (for now) is to call close() on the websocket on beforeunload, as Alexander pointed out.

Update 2016-04: According to Bugzilla, this will be fixed in Firefox 48