Node.js 使用ws发送自定义事件

Node.js 使用ws发送自定义事件,node.js,reactjs,websocket,ws,Node.js,Reactjs,Websocket,Ws,我正在尝试使用本机WebSocket和后端的ws在客户端上侦听自定义事件 我首先创建一个连接客户端池 import express from 'express' import http from 'http' import WebSocket from 'ws' import { v4 as uuidv4 } from 'uuid' import processes from './routes/process.js' import { EventEmitter } from 'events'

我正在尝试使用本机WebSocket和后端的ws在客户端上侦听自定义事件

我首先创建一个连接客户端池

import express from 'express'
import http from 'http'
import WebSocket from 'ws'
import { v4 as uuidv4 } from 'uuid'
import processes from './routes/process.js'
import { EventEmitter } from 'events'

// Express
const app = express()

// Initialize a simple http server
const server = http.createServer(app)

// Initialize the WebSocket server instance
const wss = new WebSocket.Server({ server })

let connections = {}

wss.on('connection', (socket) => {
  socket.id = uuidv4()
  connections[socket.id] = socket
  socket.send(socket.id)

  console.log(`Client connected ID: ${socket.id}`)

  socket.on('close', () => {
    delete connections[socket.id]
    delete socket.id
  })
})
在react上,我存储
socketID

const [socketID, setSocketID] = useState('')

useEffect(() => {
  const socket = new WebSocket('ws://localhost:4000')
  socket.onmessage = (message) => setSocketID(message.data)
}, [])
我想做的是,然后使用
socketID
向特定的客户端发送消息,我使用axios from react将
socketID
以请求的形式发送到express route

然后回到服务器,我使用EventEmitter从路由中获取客户机ID,我省略了详细信息,原因有点长,但此时服务器正确识别客户机,问题似乎是发送自定义事件

connections[socketID].send('notify', 'Hello specific client')
在客户端上,我监听自定义
nofify
事件

useEffect(() => {
  const socket = new WebSocket('ws://localhost:4000')
  socket.onmessage = (message) => setSocketID(message.data)
  // Set notify listener to notify this specific client only
  socket.addEventListener('notify', (data) => {
    // I am expecting 'Hello specific client'
    console.log(data)
  })
}, [])

当我检查react dev tools时,我可以看到
socketID
正在接收“自定义事件”,它将
socketID
更改为单词
notify
。很明显,ws只是发送notify这个词,而不是作为自定义事件发送,而是作为客户端作为
onmessage
而不是eventListener接收的普通消息发送。

因为我在任何地方都找不到关于ws发送自定义事件的任何信息,所以我只使用了唯一的发送事件来执行所有操作,我在消息中附加了一个事件字符串,以了解触发了哪个事件字符串

虽然不理想,但效果很好。如果有人能想出更好的办法,请告诉我

wss.on('connection', (socket) => {
  socket.id = uuidv4()
  connections[socket.id] = socket
  socket.send(JSON.stringify({ event: 'ID', id: socket.id }))

  console.log(`Client connected ID: ${socket.id}`)

  socket.on('close', () => {
    delete connections[socket.id]
    delete socket.id
  })
})

connections[socketID].send(
  JSON.stringify({ event: 'notify', payload: 'Hello specific client')})
)

这就是我正在做的。我不知道怎样才能实现它。不幸的是,如果同时收到多条消息,它似乎不起作用-我给data.event分配了一个变量,然后用它做了很多事情。因此,当第一条消息通过时,变量被赋予其值,但在函数可以完成运行之前,第二条消息会为变量重新分配一个新值。您知道如何将变量绑定到消息,并在收到新消息时阻止其更改吗?
useEffect(() => {
  const socket = new WebSocket('ws://localhost:4000')

  socket.onmessage = (message) => {

    const data = JSON.parse(message.data)

    if (data.event === 'ID') {
      setSocketID(data.id)
    }

    if (data.event === 'notify') {
      console.log(data.payload)
    }
  }

}, [])