Socket.io 404 Not Found when using express server

Coding Help
,
#1

Greetings,
First, my nodejs understanding is semi-limited. I watched a youtube video, made adjustments, then took off on my own. The server and file work perfectly fine when I run it on my computer (windows 10). Basically, an online tank game fighting endless swarms of enemies.
I uploaded the files to glitch so I could try it out online. Made various corrections (like apparently I needed to define variables and not just use them…), and now, the server says it is running (thankfully!). But, the index.html won’t load properly.

I keep getting a 404 Not Found Error on: https://temp-running-1.glitch.me/socket.io/?EIO=3&transport=polling&t=NRuzfBV

At this point, I don’t know what to do. Any help would be greatly appreciated. I’m not even sure I’m using the right port, or how to set the port, or… well, I just don’t know. Honestly, I’m pretty sure I set the port to 2000, it says it’s listening on 3000, and my index.html just hangs (I’m pretty sure it’s waiting on a response from the server).

https://temp-running-1.glitch.me

Long story short, I’m trying to make a game for my students, so that they can create a function that draws a tank, and I’ll import them all, and then have them play with their own personal tank. Great idea, took a LOT of time (far too much), but now I’m just stuck. Fingers crossed that someone here knows what I need to do next (I’ve tried various things so far, but ultimately, I’m just desperately trying random things hoping one will eventually work).

Thanks in advance,
Guerrero

#2

Hi @jamma6! Welcome to the Glitch community! :slight_smile:
I don’t think Glitch supports that port. You need to set it to 3000 in all your config (incl. Socket.io)
Let me know if that helps.

2 Likes
#3

Or you can just use process.env.PORT which will always be correct @jamma6

1 Like
#4

Yes, process.env.PORT is used just in case Glitch decides to change ports from say 3000 to 8080.

#5

I have tried setting it to 3000, and it gives me an ERROR and tells me that the port is already in use.
I’ve tried to not assign a port, and I don’t get an error, but it doesn’t work any better.

Also, I don’t think I have a socket.io file? I definitely didn’t create one myself. I did find a “socket.io.js” file in my “views” folder, but I have no idea if it auto-generated, or if I found one online and threw it in there as an act of desperation from something I read online earlier. Also, not sure how to properly edit/create a socket.io file, as I couldn’t find “2000” or “3000” anywhere in the “socket.io.js” file I found.

But I’m trying!

#6

Any suggestions on the exact syntax to use, or where to put it?

This is what I have so far:
var express = require(“express”);
var app = express();
var serv = require(“http”).createServer(app);
var io = require(‘socket.io’)(2000)
// I deleted a section just now about options and cors because I read it might help,
// but glitch thought I was adding too many “links”, so I deleted it.

app.get("/", (request, response) => {
response.sendFile(__dirname + “/views/index.html”);
});

app.use(express.static(“public”));
app.use("/views", express.static(__dirname + “/views”));

I’ve tried changing “var io = require(‘socket.io’)(2000)” to 3000, but that gives me an ERROR about being in use already.
I’ve tried deleting the (2000), and that gives me an entirely different error, specifically:
io.sockets.on(“connection”, function(socket) {
^
TypeError: Cannot read property ‘on’ of undefined

Perhaps the process.env.PORT would solve my problems, but I don’t know where to place it, and/or which lines to remove once the new line renders the other lines unnecessary…

Sorry if these are basic questions!

#7

This is my socket.io config on a Glitch project:

const io = require('socket.io')(3000, {
  path: '/socket.io',
  serveClient: false,
  // below are engine.IO options
  pingInterval: 10000,
  pingTimeout: 5000,
  cookie: false
});

There’s no such thing! :slight_smile: @jamma6

3 Likes
#8

I tried that just now, and this is the error I receive:

events.js:174

  throw er; // Unhandled 'error' event
  ^

Error: listen EADDRINUSE: address already in use :::3000
at Server.setupListenHandle [as _listen2] (net.js:1280:14)
at listenInCluster (net.js:1328:12)
at Server.listen (net.js:1415:7)
at Function.listen (/rbd/pnpm-volume/be053dbc-914d-4576-909b-9d5758a2c3a3/node_modules/express/lib/application.js:618:24)
at Object. (:22)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions…js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)

Emitted ‘error’ event at:
at emitErrorNT (net.js:1307:8)
at process._tickCallback (internal/process/next_tick.js:63:19)
at Function.Module.runMain (internal/modules/cjs/loader.js:834:11)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)

#9

Hiya.
I remixed and found one of your issues:
change the top part to this:

var express = require("express");
var app = express();
var serv = require("http").createServer(app);
const io = require('socket.io')(serv);

app.get("/", (request, response) => {
  response.sendFile(__dirname + "/views/index.html");
});

app.use(express.static("public"));
app.use("/views", express.static(__dirname + "/views"));
serv.listen(3000);

What you were doing was starting just the app and not serv which has both socket.io and app added

#10

Furthermore, you are using an outdated socket.io version on the client-side when compared to the server-side.
This is the URL you should use:
https://cdn.socket.io/socket.io-3.0.5.js
@jamma6

#11

Or you could use the compact version for a bit more speed:

https://cdn.socket.io/socket.io-3.0.5.min.js

2 Likes
#12

Ok, I updated the client side, so that I use the newer version of the socket io,
but the code you gave me for the server side is almost identical to code I already had, although some of it I had commented out while trying other methods to solve my problem.

I have put what you showed, but it doesn’t seem to fix the underlying problem, because I’m still getting:
Error: listen EADDRINUSE: address already in use :::3000

Any ideas what could be causing my “already in use” error for port 3000?
(I feel I’m stuck between getting an error for double-use of port 3000, or an error for no port at all…)
And is there anything I need to do client-side to make my client file use port 3000?

#13

Hi there again @jamma6
First off, I don’t know who is flagging your posts, whoever is is abusing their power, sorry about that. There is no need for these to be flagged - @glitch_support please note that I don’t see why these are flagged and they shouldn’t be removed.

To answer your question, this needs to be removed:

// listen for requests :)
const listener = app.listen(process.env.PORT, () => {
  console.log("Your app is listening on port " + listener.address().port);
});

By keeping that you are starting serv and starting app on the same port, you only need one since app is included in serv

7 Likes
#14

OH MY GOD! That was it!
That one line was causing my 101 headaches…

Thank you SO MUCH! I’ve literally spent probably 20+ hours (non-consecutively, but literally more than 20 hours) trying to get this to work properly online.

Side note: Are you really 14 years old? I’m 42 - thought I had a Computer Science major or computer web developer helping me, but nope. It’s a kid who is too young to even be one of my students! But still, thank you so much!

Also, I didn’t even know my posts were being flagged. At least you were able to help me before the entire thing got deleted!

4 Likes
#15

No problem! I get headaches like that all the time and this forum really helps. Glad it was fixed! And yes, I am 14 :slight_smile:

#16

Hey @EddiesTech thanks for jumping in here to help out!

When a new user posts multiple times with similar looking links, Discourse our forum platform provider will automatically flag the posts so that we can confirm that they are not spam.

@jamma6, I’m sorry that your posts got flagged for this reason! Now that we reviewed and approved the posts, this should not happen again.

7 Likes
#17

Ah! That makes sense! Thanks for replying :slight_smile:

#18

I was not offended at all that my posts were flagged. Heck… I didn’t even notice! LOL

I’m just super grateful I found a solution to my problem.

Although, on that note, how do I write something like “socket. io” without it trying to create a link for me?

1 Like
#19

You can write it inside backticks (`) to make something like this: socket.io
or to format code use 3 backticks (```) then the code, than another 3
e.g.

console.log("hello world");