So I am creating a chat application and I want to handle multiple chat rooms. Now I watched some tutorials and came up with a way.
const io = require("socket.io")(http);
io.on("connection", (socket) => {
socket.on("joinRoom", (roomid) => {
//Joining the room
socket.join(roomid)
//Broadcasting all previous messages
io.to(roomid).emit("messages",allPreviousMessages)
})
socket.on("chatMessage", (data) => {
//Saving msg to dB then broadcasting
io.to(roomid).emit("message",receivedMessage)
})
socket.on("disconnect",(data) => {
//updating user's lastSeen info in dB
})
})
So on my frontend when user clicks on a chatroom we call the "joinRoom" event and connect to the room and on clicking another chatroom make the same process of joining room.
Is this an ideal way for handling multiple chatrooms? If not so please let me know a better solution.
I think the best way to implement private rooms or channels or chats is this way. I have implemented an example for these three sections. Link
User token and api must be authenticated before connecting to socket.io. If this part is ok it will connect to socket.io otherwise it can't cause you to see the event that is there. Something happens by calling each of them. For example, by calling this onNotificationForVoiceCall event, the received data is first checked, then it is checked whether this user is present in the list of online users or not, and the state of the next step is checked. Whether or not this room has already been created in the database, the response of all these operations is returned to the user by socket.emit,
And I fixed some bug in project.
Related
I have been stuck with this problem for a while now . I want to emit to all the connected clients of a room when a new client joins the room. I have already seen the https://socket.io/docs/v3/emit-cheatsheet/index.html and tried all the emit methods for rooms as seen below in server code and none of them work except the one which emits to all the connected clients and not to a specific room.
Server code
socket.on("newUser", (data) => {
socket.join(data.sessionId);
//not a single one of these works to emit to a specific room
socket.broadcast.to(data.sessionId).emit("userJoin", data);
io.to(data.sessionId).emit("userJoin", data);
io.in(data.sessionId).emit("userJoin", data);
io.sockets.in(data.sessionId).emit("userJoin", data);
//only this works but send to all the clients
io.emit("userJoin", data);
});
client code
//simply adds a div with info to inform other users that a new user has joined
//works only on io.emit() which emits to all the connected clients of every room
socket.on("userJoin",(data)=>{
const users=document.getElementById('users');
const noUsers=document.getElementById('noUsers');
if(data.action==='join'){
const user = document.createElement('article');
user.classList.add('card');
user.classList.add('lobby-item');
user.innerHTML=`<header class='card__header'>
<h1 class='session__id'>
${data.user.name}
</h1>
</header>`;
users.appendChild(user);
}
});
I think the problem with all the room emit methods not working might be with the rooms being formed wrongly or are empty.But still none of the methods for rooms work here.
Don't process overlep the socket event name and Check that the data object was sent correctly
example
io.to(data.sessionId).emit("userRoomJoin", data);
io.emit("userJoin", data);
Split the socket event name.
If it still doesn't work.
console.log(data.sessionId);
Check that the data object was not undefinded.
when you use an object into your code try to check is it undefinded or no !
so try this command :
console.log(data);
In socket io if there is a redirect from the app or a refresh from the client there is a new socket.id created which means that the old socket was disconnected and a new one was created.
In my app i was first doing socket.emit() on the join in route and then redirecting the user to a different lobby route which meant that the socket which joined the room had been disconnected due to redirecting it to lobby and a new socket was created which wasn't in any room.
Therefore io.to(data.sessionId).emit() wasn't working as all the socket that joined the room were disconnected due to redirecting. io.emit() works as it emits to all the sockets that are currently connected
If anyone is experienced with Websockets / Socket IO hopefully you can point me in the right direction.
I made a Discord Clone and I'm trying to optimize it to scale better. Right now when a user sends a message I query the DB for all users part of that server, and emit a message to their specific socket. This is obviously not going to scale well as every message requires a expensive query and lookup in the client list
// Emit messages to only users part of specific server
// Will only return list of users part of server and active in last 10 minutes
sqlQuery = `SELECT userservers.user_id FROM userservers
JOIN users ON users.user_id = userservers.user_id AND users.user_last_active > (NOW() - INTERVAL 10 minute)
WHERE server_id = ${sql.escape(serverId)}`;
const users = await sql.query(sqlQuery);
action = { type: "message", payload: msg };
// Iterate over users, and find them in clients list
// Emit over socket only to that user
users.forEach((user) => {
clients.forEach((client) => {
if (client.userId === user.user_id) {
io.to(client.id).emit(user.user_id, action);
}
})
});
However using Rooms for each Sever would eliminate my need to query the DB. I understand I can do this when the socket server first starts
// Get server list from Mysql DB
servers.forEach((server) => {
socket.join(server.name);
}
However my issue becomes, when a user create a new server once the application is already running It will not update the list.
I am probably missing some concept on creating dynamic rooms.
EDIT : I am thinking the solution could be that every time a "server" is created, I send a message to the socket server so it can join that "room"
Right now when a user sends a message I query the DB for all users part of that server
I think you can submit broad cast message to all online users, so instead of forEach client => io.to(clientId) you can submit broad cast message to all connected users io.emit('some event', { for: 'everyone' });
also I'm wondering why you are creating many servers? you can divide your server into namespaces by using const namespace = io.of('/thisIsASeparateNamespace'); and also you can submit broadcast messages to all users inside this name space by namespace.emit('some event', { for: 'everyone in name space' });
So your chat structure can be like this
Server
Namespaces // for separate chat app / or like slack work spaces
Rooms // for group chatting
ClientID // for one to one
I'm using node.js with a React front end. I'm building a GPS based MMO type of game. I recently decided to drop most HTTP requests and go with sockets, so I can emit data whenever I want and the front end only has to worry about what to do with it when it receives it.
I've built sites with sockets before, but never ran into this issue.
Basically, every time my browser opens a socket connection with node, it opens 2-3 connections at once(?). When it disconnects, I get the console.log stating that 3 socket connectionss have been closed. It'll look like this:
User disconnected
User disconnected
A user has connected to the system with id: nUMbkgX6gleq-JZQAAAD
A user has connected to the system with id: CzFtR2K5NJ1SoiHLAAAE
A user has connected to the system with id: tgGYhpXuOONmL0rMAAAF
For now, it wouldn't be an issue, however I'm only getting the FIRST 'inventory' emit to work. Later when I call the function to emit inventory again, the browser doesn't seem to get it. But the console logs in the node function will trigger correctly.
I have a feeling that this has something to do with multiple sockets opening.
Here is the React Event:
this.socket.on("inventory", charData => {
console.log('heres the data', charData)
props.setCharStats(charData[0])
})
Here's the node emitter:
const getCharInventory = (charId, userId) => {
dbInstance
.getCharInventory(charId)
.then(response => {
console.log( // this console.log happens just fine
"emmited inventory, userId is: ", userId, " with this response: ", response)
socket.emit("inventory", response)
})
.catch(err => console.error(err))
}
I'm such a dork. I was starting multiple connections within multiple connections.
In more than one component, I had this...
this.socket = socketIOClient(`${process.env.REACT_APP_proxy}`)
Sooo..... yeah. Just an FYI to others, it's better to connect in 1 file and import it into others.
I currently use the following code to allow users to create/join a specific room in socket.io:
socket.on('create', function (roomId) {
...
socket.join(roomId);
...
});
since the join function is used for both creating AND joining the same room, I would like tell the client if he was the one that created the room or just joined an existing one.
WHAT I TRIED TO DO
I tried to store the Id (and other informations not related to the problem), then check whenever that id already exists and emit a different message depending on the results. something like:
// "repo" is a variable declared globally
socket.on('create', function (roomId) {
...
socket.join(roomId);
if (repo.hasRoom(roomId)) {
app.io.sockets.in(roomId).emit('someone Joined');
} else {
app.io.sockets.in(roomId).emit('someone Created this room');
repo.saveRoom(roomId);
}
...
});
the above code doesn't work, as the client is unable to receive the message emitted (I guess because is on the "create" event). to be clear, I CAN determine on the server if a room is created, but the CLIENT doesn't know.
Is there an effective way to notify the client if he was responsible for creating or just joining a room?
Is it possible to check whether a user has subscribed to a certain channel in socket.io?
Let´s say I have a channel called news. User subscribed to that channel on client-side. But the site´s data is dynamic, therefore the news-tab of the site might not be open at any time. I do not want to create the content for the news-tab if the news tab is not open on the client-side. I know that the news-tab is not open, when the user has not subscribed to the news channel.
Is there a way to check that?
You can use io.sockets.clients('news') and this will return the socket id's of all clients. If you know the client socket.id, you could also call io.sockets.manager.roomClients[socket.id] (room name will have '/' leading character)
This is a sample I use for my admin clients to call to get client counts per room:
socket.on('countClientsInRoom', function (room, callback) {
var count = io.sockets.clients(room).length;
callback(count);
});