浏览器使用JS socket.io连接多个套接字

Question

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)) } 

Answer 1

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.