Socket IO and Dynamic Rooms - javascript

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

Related

Ideal way to handle multiple socket rooms?

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.

How can i send data to u particular user using socket.io

i am building a mobile app with ionic, i am using socket.io, i want to be able to send message to a particular user with an id, and not broadcast the message to everyone, the chat application is not a chat room style kind of app but a one on one chatting app like watsapp, i searched online but what i saw was not working, here is the code for the server side
const io = require('socket.io')(server);
io.on('connection', socket => {
console.log('New user connected');
socket.on('get_all_msg', data => {
DBConn.query(`SELECT * FROM chats WHERE rec_id = ? || send_id=?`, [data.id, data.id], (error, results, fields) => {
if (error) throw error;
io.to(data.id).emit('all_msg', results)
});
})
})
the id of the user i am chatting with is the data.id, i tried using io.to(data.id).emit('all_msg', results) but the user did not receive any message, pls what am i doing that is not right
Here's the client side code
this.socket.emit('get_all_msg', {id:this.contactInfo.id})
this.service.socket.fromEvent('all_msg').subscribe((data:any) => {
console.log(data)
})
I am using ngx-socket.io in my ionic add
we need to map socket id to user id;
we can solve this using redis but simple way i did was
actually socket io itself joins the current into a room with its id(socketio) itself;
i was like, "why not join that socket into room with user_id"
backend side:
io.on('connection',socket=>{
socket.on('join-me',userid=>{
socket.join(userid);
})
})
front end side:
const socket=io(`blahblah`);
socket.on('connect',()=>{
socket.emit('join-me',current_user_id);
})
when one user emits new-message event
we can get the participent id's and can simply loop over their ids and emit an event
socket.on('message',data=>{
//do some logic let say
participents=data.participents;
parsedMessage=someLogic(data);
for(id of participents){
//here is the magic happens io.to(room_id) here room id is user id itself.
io.to(id).emit('new-message',parsedMessage);
}
})
works with one to one and group chat!

Browser connecting with multiple sockets using JS socket.io

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.

socket.io - How to join a room

I am writing a chatting app. Right now, when a new conversation between user A and user b is initiated by user A, user A sendS a socket message to server with user B's userId.
The Server checks whether there's a conversation existing between the two users, if not, creates one, and have user A join the new conversation(clientA.join(newConversationId)). But I don't know how to have user B join the room too if user B actually has a connected socket now.
What I think might work is keeping an object mapping userId to socket.id, so I can get user B's socket id by B's userId sent along with A's origin message. And then I'll get B's socket by its socket ID, and have it join the conversation too.
The problem is, I don't know how to get a socket by a socket ID. I don't think there's an official document of this. Or is there other better way to deal with something like this?
Yes, you have to keep track of your users id.
This code may help you a little with that.
var io = require("socket.io").listen(conf.port);
var customIds = [];
io.on("connection", function (socket) {
socket.on("login" function (data) {
customIds[socket.id] = data.userId;
});
/**
* Executes when a client disconnect.
* It deletes this client and updates and emits the client new client list
*/
socket.on("disconnect", function () {
// leave the current room
//socket.leave(socket.room);
// emit event
//socket.broadcast.to(socket.room).emit("clientDisconnected",customIds[socket.id]));
// delete the custom id from the custom id array.
customIds.splice(socket.id, 1);
});
}
You can also save your userid like this (Do not modify socket.id)
socket.userId=XXXX
Get a list of clients and look for the user id you need
io.sockets.clients();

Sending subsets of streaming data to Node clients using Sockets.io

I have a Node server which sends streaming tweets to clients as they connect, using Sockets.io and ntwitter. At the moment all the tweets (from different users) get sent to every client. But each client only requires a certain subset of tweets, and I'd like to the server to only send that subset (or category).
I think that having each category being like a room, in Sockets, would work, but I can't quite work out how to adapt my code to use them. Or, given that there's no communication between clients, maybe that's not the best solution?
The relevant, simplified, bits of current code...
Client:
var socket = io.connect(window.location.hostname);
socket.on('messages', function(messages_packet) {
$.each(messages_packet, function(idx, tweet) {
if (tweet_is_in_this_clients_category(tweet)) {
display_messages(messages_packet);
};
}
});
Server:
// [A function which, on start-up, fetches existing tweets and caches them.]
// Send cached messages when a client connects.
sockets.sockets.on('connection', function(socket) {
socket.emit('messages', cached_messages);
});
// Fetch tweets from the stream, and send new ones to clients.
twitter.stream('statuses/filter', {follow: [12345, 345678, etc]}, function(stream) {
stream.on('data', function(tweet) {
add_tweet_to_cache(tweet);
sockets.sockets.emit('messages', [tweet]);
}
});
So, the sockets.emit() part is currently sending every tweet to all the clients. And then the client decides whether to show that tweet, if it's in the client's category. It would obviously be more efficient if the server only sent tweets to the clients in the correct category. Given the server already knows which tweets are in which categories, how do I only emit them to those categories, rather than every client?
After some trial and error I seem to have it working. No idea if this is the best or correct way, but... the above code has been tweaked so it's now something like that shown below. There's one addition to the client code, and two to the server code.
Client:
var socket = io.connect(window.location.hostname);
// NEW CLIENT PART:
socket.on('connect', function(){
// room_name was created based on the URL this page was requested at:
socket.emit('subscribe', room_name);
};
socket.on('messages', function(messages_packet) {
$.each(messages_packet, function(idx, tweet) {
if (tweet_is_in_this_clients_category(tweet)) {
display_messages(messages_packet);
};
}
});
Server:
// [A function which, on start-up, fetches existing tweets and caches them.]
// Send cached messages when a client connects.
sockets.sockets.on('connection', function(socket) {
// NEW SERVER PART 1:
socket.on('subscribe', function(room_name) {
socket.join(room_name);
socket.emit('messages', cached_messages_for_this_room);
});
});
// Fetch tweets from the stream, and send new ones to clients.
twitter.stream('statuses/filter', {follow: [12345, 345678, etc]}, function(stream) {
stream.on('data', function(tweet) {
add_tweet_to_cache(tweet);
// NEW SERVER PART 2:
// Gets the array of room_names this twitter account is associated with:
var rooms = get_rooms_for_twitter_account(tweet.user.screen_name);
rooms.forEach(
function(room_name) {
sockets.sockets.in(room_name).emit('messages', [tweet]);
};
);
};
});
So, when a client connects it sends a 'subscribe' message, and the name of the room it wants to join.
When the server receives a 'subscribe' event it sends only the existing tweets associated with that room (the logic for getting that list of tweets is done elsewhere; not relevant to this particular issue).
And whenever a new tweet is picked up by the server, it finds the room(s) this tweet is associated with, and then emits the tweet to every client in each of them.
This seems to work... do point out anything that makes no sense, or could be done much better!

Categories