socket.io | NodeJS《你画我猜》游戏 | Socket library

I have a login route that eventually create a jwt cookie named access_token. After the login the client will receive this cookie and will send it on every request. However I didn’t found a way to pass this cookie on to Socket.io.

Server side login route :

I have created a custom async emitter to have a server -> client -> server method.

However, it doesn't work as expected. It emits the event, but does not run the callback.

With Socket.IO debugging enabled, I can see that the socket.io:socket is logging that it is emitting the correct event.

Function code:

I have an NPM package I am working on which has a dependency of react. I then have a test app which has react installed as a dependency. When I import my npm package into the test app, I get the following error:

Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

Running npm ls react in my test app suggests I might have a duplicate of react:

Is there any trick to get a unique user identifier, which doesn't change, when the user refreshes the browser? I've tried socket.io and sessionID from express, but those change when the user refreshes the browser.

Why? I'm trying to make a game without the need to log in. The User class will create a lobby with friends and then start the game, which will be locked for any other users, but I want to make the feature, that if the user who has already started/joined any game will refresh the browser, he will be reconnected to his game.

I'd already set up the database which is ready for the unique user identifier, so the lobby/game will know who will be authorized to join and who will be not.

Code of how my sessions are set up:

Setup:

• Socket.io in React with react-router-dom
• Socket instance passed to child components via useContext
• Backend built using Express

Problem:
Navbar listens for socket events to update counters for unread messages. Everything works fine until user navigates to a different page. Once a navigation occurs, the socket in navbar (which never unmounts) is unresponsive to future events being emitted from the server even though the connection is intact.

Expected behaviour:
Navbar socket remains responsive to emits from server after page navigation.

Observation:
Other areas of the app where socket is utilized remains functional even while navbar socket is unresponsive. The navbar socket becomes responsive again when page is refreshed but the same problem repeats after page navigation. The navbar is the only component that doesn't unmount when a navigation occurs while components mounted on navigation is loaded with the socket instance via useContext.

As far as I can see, connection is never broken (disconnect event never fires on server-side) and the newly mounted component can emit an event, server responds, and emits a response back to client where the new component responds while the navbar doesn't.

Other notes:
This is the first question I've ever asked so my apologies in advance if the question is poorly formatted. The code is obviously simplified to leave out areas where it seems to not affect the problem. The server-side code is omitted because it seems to receive and emit events without any problems.

I fail to enable the CORS for testing with the latest NestJS 8.0.6 and a fresh http + ws project. That said, I want to see the Access-Control-Allow-Origin in the servers response (so that the client would accept it). Here is my main.ts where I've tried 3 approches: 1) with options, 2) with a method, 3) with app.use. None of them works.

I'm a JS, phaser3 and Socket.io newbie and I really want to learn.

Code Context:

• Phaser3
• Socket.io
• Loading state of game room before socket connects
• Generating the NPC's and players
• fails when there's an attempt to access NPC's (mass) sprite in the same callback it was created

Issue:

• Cannot access the sprite property, and in general seems like the object wasn't created in the first place

I have the socket listening in Phaser3's "create()" function for "universeState" after it has connected to the socket server. index.js:

I have upgraded my angular to angular 13. when I run to build SSR it gives me following error.

I am working on a chat application using React and socket.io. Back end is express/node. The relevant components are: Room.js --> Chat.js --> Messages.js --> Message.js

messageData received from the server is stored in state in Room.js. It is then passed down through Chat.js to Messages.js, where it is mapped onto a series of Message.js components.

When messages are received, they ARE appearing, but only after I start typing in the form again, triggering messageChangeHandler(). Any ideas why the Messages won't re-render when a new message is received and added to state in Room.js? I have confirmed that the state and props are updating everywhere they should be--they just aren't appearing/re-rendering until messageChangeHandler() triggers its own re-render.

Here are the components.

Room.js