Estoy usando socket.io-client en mi interfaz (React) y socket.io en mi aplicación backend (Express). En mi servidor, creé un evento que, cuando se activa, debe enviar un mensaje a todos los usuarios en una sala, se parece a esto.
socket.on('connection', () => { // OTHER SOCKET EVENT LISTENERS (join, etc.) socket.on('my_event', async (roomId) => { // DO SOME DATABASE STUFF const response = ...; socket.in(roomId).emit('my_event_response', response); } });En mi cliente se ve algo como esto.
// socket.ts export const socket = io(process.env.REACT_APP_SERVER_URL || '', { withCredentials: true }); export const SocketContext = React.createContext({} as Socket); // parent.ts export const ParentNode: FC = () => { const roomId = ...; return ( <SocketContext.Provider value={socket}> <ChildNode roomId={roomId} /> </SocketContext.Provider> ); } // child.ts export const ChildNode: FC = ({ roomId }) => { const socket = useContext(SocketContext); useEffect(() => { socket.on('my_event_response', () => { console.log("USER TRIGGERED EVENT") }) return () => { socket.off('my_event_response') } }, [socket]); const handleClick = useCallback(() => { socket.emit('my_event', roomId) }, [socket, roomId]); return ( <div> <button onClick={handleClick} /> </div> ); }Cuando un usuario hace clic en un botón para desencadenar un evento, el servidor lo detecta correctamente y emite la respuesta a todos los usuarios PERO al usuario que emitió el evento original (my_event). Revisé para asegurarme de no volver a renderizar mi componente y perder el evento de alguna manera. ¿Hay alguna forma de arreglar esto para que el usuario que emitió el evento original también reciba la respuesta?
Use io.in(...).emit(...) porque socket.to(...).emit(...) emite a todos en la sala excepto al remitente, mientras que io.in(...).emit(...) emite a todos, incluido el remitente.