Node js with express and socket.io - cannot find socket.io.js

Question

I was working on a node js application with socket.io. I looked at some of the answers on SO but they could not help me with my problem. The error I am getting is

Failed to load resource: the server responded with a status of 404 (Not Found)
localhost/:10 Uncaught ReferenceError: io is not defined

Here is my directory structure:

Judgement
|----node_modules
|----|----express
|----|----socket.io
|----public
|----|----css
|----|----|----judgementMain.css
|----|----js
|----|----|----form.js
|----|----index.html
|----server.js
|----package.json

In my index.html page I have the following link to socket.io.js

  <script type="text/javascript" src="socket.io/socket.io.js"></script>
  <script type="text/javascript">
      var socket = io();
  </script>

  <script type="text/javascript" src="js/form.js"></script>

The contents of server.js are as follows

var express = require('express');
var app = express();
var path = require('path');

// Define the port to run on
app.set('port', 3000);
app.use(express.static(path.join(__dirname, 'public')));

// Listen for requests
var server = app.listen(app.get('port'), function() {
    var port = server.address().port;
    console.log('Magic happens on port ' + port);
});

var http = require('http').Server(app);
var io = require('socket.io')(http);

io.on('connection', function (socket) {
    console.log('A user connected');
    socket.on('disconnect', function() {
        console.log('A user disconnected');
    });
});

Can someone explain what I am doing wrong? I only just started with node js and express and socket.io, so any help is appreciated.

Thanks

If you put your call to io() inside a window.loaded event does it work fine? — pay
– pay, Commented Jun 28, 2016 at 20:48
@pay - There is no reason to wait for the window to load to use io(). Socket.io has nothing to do with the DOM so no reason to wait for the DOM to load before using it. — jfriend00
– jfriend00, Commented Jun 28, 2016 at 21:29

jfriend00 · Accepted Answer · 2016-06-28 21:27:22Z

I see a couple issues:

First, in your HTML, it should be src="/socket.io/socket.io.js" with the leading slash.

Second, you are creating two http servers but only actually starting one of them, when you should be using just one. Your socket.io stuff doesn't work because you're giving it an http server that you never started.

Change to this where you are giving socket.io the http server that express is using and that has been started on your desired port:

var express = require('express');
var app = express();
var path = require('path');

// Define the port to run on
app.set('port', 3000);
app.use(express.static(path.join(__dirname, 'public')));

// Listen for requests
var server = app.listen(app.get('port'), function() {
    var port = server.address().port;
    console.log('Magic happens on port ' + port);
});

var io = require('socket.io')(server);

io.on('connection', function (socket) {
    console.log('A user connected');
    socket.on('disconnect', function() {
        console.log('A user disconnected');
    });
});

Collectives™ on Stack Overflow

Node js with express and socket.io - cannot find socket.io.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related