如何向除发件人socket.io以外的所有人发送消息

Question

我知道要做这样的事情，我们必须写socket.broadcast.emit(‘聊天消息’，‘你好，伙计’)，但在我的例子中，当我这样做时，什么也没有发生，我仍然在我的浏览器中收到消息。据我所知，socket.broadcast是这样工作的，如果我从浏览器发送一条消息，我一定看不到它，但我确实看到了。

io.on('connection', (socket) => {
  console.log('a user connected');
  socket.broadcast.emit("hello", "world");


  socket.on('chat message', (msg) => {
    console.log('message: ' + msg);
    socket.emit("chat message", msg)
    socket.broadcast.emit("chat message", msg) <=== doesn't work
  });

  socket.on('typing', (data) => {
    io.emit('typing', data)
  })

  socket.on('disconnect', () => {
    console.log('user disconnected');
  });
});

反应

import {useEffect, useState} from "react";
import {io} from "socket.io-client";
import {Button, ChatField, ChatFieldArea, Input, Wrapper} from "./styled/appstyled";


function App() {
  const [message, setMessage] = useState("")
  const [messageList, setMessageList] = useState([])
  const [typing, setTyping] = useState(false)


  const ENDPOINT = "ws://localhost:4444";
  const socket = io(ENDPOINT, {transports: ['websocket']});

  let typingTimer;

  useEffect(() => {
    socket.on("chat message", (data) => {
      setMessageList(p => [...p, data])
    })

    socket.on("typing", (data) => {
      setTyping(data)
    })

    return ()=>{
      socket.disconnect();
    }

  }, [])

  const handleSubmit = (e) => {
    e.preventDefault()
    if (message.length > 0) {
      socket.emit('chat message', message);
      socket.emit('typing', false)
      setTyping(false)
      setMessage("")
    }
  }

  return (
      <h1>
        <form onSubmit={handleSubmit}>
          <ChatFieldArea>
            <ChatField>
              {messageList.map((el, i) => {
                return (
                    <span key={i}>{el}</span>
                )
              })}
            </ChatField>
            <Wrapper>
              <Input onChange={(e) => {
                if (e.target.value.length > 0) {
                  setMessage(e.target.value)
                }
              }} value={message}
                     onKeyDown={(e) => {
                       if (e.key !== 'Enter') {
                         setTyping(true)
                         socket.emit('typing', true)
                         clearTimeout(typingTimer)
                       }
                     }}
                     onKeyUp={() => {
                       clearTimeout(typingTimer)
                       typingTimer = setTimeout(() => {
                         socket.emit('typing', false)
                         setTyping(false)
                       }, 1000);

                     }}/>
              <Button type={"submit"}>Click</Button>
            </Wrapper>
            {typing ? "typing" : 'not typing'}

          </ChatFieldArea>
        </form>
      </h1>
  );
}

export default App;

Answer 1

这是因为您同时使用了socket.emit和socket.broadcast.emit。如果您只想向用户而不是发件人发送消息，则删除socket.emit调用

socket.emit -向发件人发送消息

socket.on('chat message', (msg) => {
    console.log('message: ' + msg);
   // socket.emit("chat message", msg)  REMOVE THIS
    socket.broadcast.emit("chat message", msg) // WILL send to everyone except sender
});