How to wait for a WebSocket's readyState to change
javascript, polling, websocket
Solution
Here is a more elaborate explanation. First off, check the specific browser API, as not all browsers will be on the latest RFC. You can consult the
You don't want to run a loop to constantly check the readystate, it's extra overhead you don't need. A better approach is to understand all of the events relevant to a readystate change, and then wire them up appropriately. They are as follows:
`onclose` An event listener to be called when the WebSocket connection's readyState changes to CLOSED. The listener receives a CloseEvent named "close".
`onerror` An event listener to be called when an error occurs. This is a simple event named "error".
`onmessage` An event listener to be called when a message is received from the server. The listener receives a MessageEvent named "message".
`onopen` An event listener to be called when the WebSocket connection's readyState changes to OPEN; this indicates that the connection is ready to send and receive data. The event is a simple one with the name "open".
JS is entirely event driven, so you need to just wire up all of these events and check for the readystate, this way you can switch from WS to polling accordingly.
I recommend you look at the Mozilla reference, it's easier to read than the RFC document and it will give you a good overview of the API and how it works (link).
Don't forget to do a callback for a retry if you have a failure and poll until the callback for a successful reconnect is fired.
Problem
I'm trying to implement a WebSocket with a fallback to polling. If the WebSocket connection succeeds, `readyState` becomes 1, but if it fails, `readyState` is 3, and I should begin polling. I tried something like this: ``` var socket = new WebSocket(url); socket.onmessage = onmsg; while (socket.readyState == 0) { } if (socket.readyState != 1) { // fall back to polling setInterval(poll, interval); } ``` I was expecting `socket.readyState` to update asynchronously, and allow me to read it immediately. However, when I run this, my browser freezes (I left it open for about half a minute before giving up). I thought perhaps there was an `onreadyStateChanged` event, but I didn't see one in the MDN reference. How should I be implementing this? Apparently an empty loop won't work, and there is no event for this.