Connecting client to server using Socket.io

Question

I'm relatively new to node.js and it's addons, so this is probably a beginnersquestion.

I'm trying to get a simple HTML page on a webserver connect to a different server running node.js with websocket.io.

My code looks like this:

Client

<script src="socket.io/socket.io.js"></script> <script>     // Create SocketIO instance, connect      var socket = new io.Socket();      socket.connect('http://127.0.0.1:8080');       // Add a connect listener     socket.on('connect',function() {       console.log('Client has connected to the server!');     });     // Add a connect listener     socket.on('message',function(data) {       console.log('Received a message from the server!',data);     });     // Add a disconnect listener     socket.on('disconnect',function() {       console.log('The client has disconnected!');     });      // Sends a message to the server via sockets     function sendMessageToServer(message) {       socket.send(message);     }; </script> 

Serverside

// Require HTTP module (to start server) and Socket.IO var http = require('http'); var io = require('socket.io'); var port = 8080;  // Start the server at port 8080 var server = http.createServer(function(req, res){      // Send HTML headers and message     res.writeHead(200,{ 'Content-Type': 'text/html' });      res.end('<h1>Hello Socket Lover!</h1>'); });  server.listen(port);  // Create a Socket.IO instance, passing it our server var socket = io.listen(server);  // Add a connect listener socket.on('connection', function(client){      console.log('Connection to client established');      // Success!  Now listen to messages to be received     client.on('message',function(event){          console.log('Received message from client!',event);     });      client.on('disconnect',function(){         clearInterval(interval);         console.log('Server has disconnected');     }); });  console.log('Server running at http://127.0.0.1:' + port + '/'); 

Starting up the server works fine and running http://localhost:8080 in my browser also works, returning 'Hello Socket Lover' as expected. But I want to make a different page talk to the sockets, not run one from node.js.

But when I run it, nothing happens and the Chrome console returns:

Failed to load resource            http://undefined/socket.io/1/?t=1333119551736 Failed to load resource            http://undefined/socket.io/1/?t=1333119551735 

I've been at this all day. Any help?

Answer 1

Have you tried loading the socket.io script not from a relative URL?

You're using:

<script src="socket.io/socket.io.js"></script> 

And:

socket.connect('http://127.0.0.1:8080'); 

You should try:

<script src="http://localhost:8080/socket.io/socket.io.js"></script> 

And:

socket.connect('http://localhost:8080'); 

Switch localhost:8080 with whatever fits your current setup.

Also, depending on your setup, you may have some issues communicating to the server when loading the client page from a different domain (same-origin policy). This can be overcome in different ways (outside of the scope of this answer, google/SO it).