Closing WebSocket correctly (HTML5, Javascript)

by

According to the protocol spec v76 (which is the version that browser with current support implement):

To close the connection cleanly, a frame consisting of just a 0xFF byte
followed by a 0x00 byte is sent from one peer to ask that the other peer
close the connection.

If you are writing a server, you should make sure to send a close frame when the server closes a client connection. The normal TCP socket close method can sometimes be slow and cause applications to think the connection is still open even when it’s not.

The browser should really do this for you when you close or reload the page. However, you can make sure a close frame is sent by doing capturing the beforeunload event:

window.onbeforeunload = function() {
    websocket.onclose = function () {}; // disable onclose handler first
    websocket.close();
};

I’m not sure how you can be getting an onclose event after the page is refreshed. The websocket object (with the onclose handler) will no longer exist once the page reloads. If you are immediately trying to establish a WebSocket connection on your page as the page loads, then you may be running into an issue where the server is refusing a new connection so soon after the old one has disconnected (or the browser isn’t ready to make connections at the point you are trying to connect) and you are getting an onclose event for the new websocket object.

More Related Contents:

  1. How to talk to UDP sockets with HTML5?
  2. In what situations would AJAX long/short polling be preferred over HTML5 WebSockets?
  3. What browsers support HTML5 WebSocket API?
  4. Connecting to TCP Socket from browser using javascript
  5. How to Use Sockets in JavaScript\HTML? [closed]
  6. Check if my website is open in another tab
  7. How to maintain a WebSockets connection between pages?
  8. Sending message to a specific connected users using webSocket?
  9. Good beginners tutorial to socket.io? [closed]
  10. Display image from blob using javascript and websockets
  11. For a push notification, is a websocket mandatory?
  12. Sharing websocket across browser tabs?
  13. Large file upload with WebSocket
  14. Do Shared Web Workers persist across a single page reload, link navigation
  15. Reading from udp port in browser
  16. Add click event on div tag using JavaScript
  17. In JQuery, Is it possible to get callback function after setting new css rule?
  18. HTML5 Video: Streaming Video with Blob URLs
  19. How to create a “show more” button and specify how many lines of text can be initially shown
  20. Include SVG files with HTML, and still be able to apply styles to them?
  21. A way to scroll an underlying div when mouse is on top of a fixed div?
  22. Load ordering of dynamically added script tags
  23. What makes an input vulnerable to XSS?
  24. Custom Checkbox
  25. Update or Change or Remove/Reset Javascript event listener
  26. HTML5 Canvas set z-index
  27. Best practice: class or data attribute as identifier
  28. Embedding youtube video “Refused to display document because display forbidden by X-Frame-Options”
  29. Check if a browser has built-in HTML form validation?
  30. Get Clicked from

Leave a Comment