CODEWITHSUNDEEP
htmlnode.jswebsocketsocket.io
alexjfno1
alexjfno1

Reputation: 337

Receiving "Error: InvalidStateError: DOM Exception 11" on HTML5 websocket when calling .send(data) using Node.js

I am currently trying to develop a small chat application using node.js. This is my first node project but I am getting an error and I'm not really sure how to solve it.

I have written a simple chat server in node which is below.

var port = 3000;
var net = require('net');
var clients = [];

var server = net.createServer(function (socket) {
  clients.push(socket);
  bindEventHandlers(socket);
});

setInterval(function(){
  console.log(clients.length);
}, 2000);

server.listen(port);
console.log('Server is listening on localhost:' + port);

function bindEventHandlers(socket) {
  socket.on('data', function(data){
    broadcastDataToAllClient(data, socket);
  });
  socket.on('close', function(){
    clients.splice(clients.indexOf(socket), 1);
  });
  socket.on('error', function(){
    console.log('Known Error << "It\'s a feature!"');
  })
}

function broadcastDataToAllClient(data, socket) {
  for (var client in clients) {
      if(clients[client] == socket){ continue; }
      clients[client].write(data);
  }
}

And a quick client interface

<!DOCTYPE HTML>
<html>
    <head>
        <title>Node.js Chat Server</title>
        <script type="text/javascript">
            function init(){
                if (window.WebSocket) {
                    var input = document.getElementById('messageBox');
                    var webSocket = new WebSocket("ws://localhost:3000/");
                    input.onkeyup = function(e){
                        if(e.keyCode == 13) {
                            console.log('sending message');
                            webSocket.send('some data');
                        }
                    };
                    webSocket.onopen = function(e){
                        alert('Open');
                    }
                    webSocket.onmessage = function(e){
                        console.log('Message');
                    }
                    webSocket.onclose = function(e){
                        console.log('Close');
                    }
                    webSocket.onerror = function(e){
                        console.log('Error');
                    }   
                } else {
                    console.log('unable to support :(');
                }
            }
        </script>
    </head>
    <body lang="en" onload="init();">
        <h1>Node.js Chat Server</h1>
        <h3>Welcome to this simple chat server!</h3>
        <input id="messageBox" size="50" />
    </body>
</html>

When I call the webSocket.send('some data') I receive this error Error: InvalidStateError: DOM Exception 11. In the chat-server code I have a loop which logs the number of current clients so I know that the browser is connected.

Not sure where to go from here and any help would be much appreciated.

Alex

Upvotes: 2

Views: 5850

Answers (1)

user568109
user568109

Reputation: 47993

When you do webSocket.send('some data') the socket connection must be established, or specifically socket.readyState == 1.

You can check the websocket events here. To make sure this never happens, you should send after connection open, by using Socket.onopen event handler. You can do it like this.

if(webSocket.readyState == 1){
    webSocket.send('some data');
  }
else{
    webSocket.onopen = function(e){
        webSocket.send('some data');
    }
}

Upvotes: 7

Related Questions