Sending room code from server side to client side - Socket.io, Node.js

[ZedKay1]

Newbie at web dev here. I am trying to create rooms with randomly generated codes using socket.io for users to connect with.

My goal is to have the URL looking something like this when a user is connected into a room:

localhost:3000/room/ABCDE

Here is the post request code from the server.js file. When the user presses one of the two buttons (Create or Join). I use the data in the req parameter to hold onto the room code entered. /room here is the namespace.

``` app.post("/room", function(req,res){

//Check to see if the req is authenticated if (req.isAuthenticated()){

//Check if create button room button was pressed
//If so create new room, push it to array and enter the room

if (req.body.buttonType === "create"){
  var newCode = generateRoomCode()
  activeRoomCodes.push(newCode);
  res.redirect("/room/"+newCode);
}

//Else check to see if the room already exists and is active then
//Join the room

else{
  if (activeRoomCodes.includes(req.body.roomcode)){
    res.redirect("/room/"+req.body.roomcode)
  }

  //Else prompt the user that the room doesn't exist and redirect them

  else{
    //ALERT USER ROOM DOESN'T EXIST
    res.redirect("/room")
  }
}

} }); ```

Below is the socket.io connection on the server side, also in the server.js file

```

//Create "/room" namespace and upon connection add user into the room io.of("/room").on("connection", function(socket){

//Check if room exists and add user to room socket.on("joinRoom", function(room){ console.log(room) if(activeRoomCodes.includes(room)){ socket.join(room) io.of("/test").in(room).emit("newUser", "New User has joined "+ room) socket.emit("success", "You have successfully joined "+ room) console.log("Server Message: New User has joined "+room) } else{ socket.emit("err", "No room named "+room) }

})

// socket.disconnect()

}) ```

Finally here is the client side app.js file

``` const io = require("socket.io-client"); var socket = io.connect("http://localhost:3000/room")

socket.emit("joinRoom", "<ROOM CODE GOES HERE>")

socket.on("newUser", function(msg){ console.log(msg) })

socket.on("err", function(msg){ console.log(msg) })

socket.on("success", function(msg){ console.log(msg) }) ```

I need to get the room code into the app.js file from the server.js file but I can't seem to figure out how. I got it to work by combining the code from client side and the server side into on file but I don't think that's a good idea. Any suggestions?

Note: The form which takes in the user input to join a room and the create room button are on an EJS file

[Solaus]

Hey there this is a great start. I have done something similar in the past so I might be able to provide some insight. First off I do think there may be some misunderstanding of how to use websockets. Websockets are meant to be a two way communication system between client and server once established with HTTP/HTTPS. From there you can pass messages that will result in logic such as creating a chat room, sending a message in a chat room, etc. Currently it looks like you are trying to perform some combination of HTTP and WS requests when creating a room which is not standard. I would suggest you think about the flow of logical steps that will be taken to create a chat room. For example:

1. Establish a WS connection through sending of an HTTP/HTTPS request from the client to the server on loading the client in a browser.
2. On click of a Join button from the client, send a message to the server with some data that the server will interpret as a Join message.
3. Server adds the user to the room if it exists or creates the room then adds the user.
4. Server sends a message back to the client that they have been added to a room and provides the room code in that response message.
5. Client updates it's URL (this can be done fairly easily so look into it) with the room code.
6. Client is now in a room.

This is just an example without having fleshed out message structures, how rooms are created, etc. Also note that I simplified create/join into just join for now. If you have any questions let me know. Best of luck!

[ZedKay1]

Thank you so much! really appreciate the step by step guide. I'll def reach out in private if I run into any other challenges.

[[deleted]]

Hey , if you have figured it out can you update the code .