socket.io |我应该将路由处理程序包装在 io.on('connection') 中吗？

Question

在下面的代码中，我假设我的路由处理程序有可能会在io 连接建立之前触发并尝试发送到套接字：

server.js：

import { Server } from 'socket.io'
....
....
const app = express()
const io = new Server(....)

app.io = io

app.post('/something', (req, res) => {
  req.app.io.emit('something', doSomethingWith(req.body))
  res.status(200)
})


io.on('connection', function(socket) {
  console.log('socket connected')

  socket.on('disconnect', (reason) => {
    console.log('disconnected due to = ', reason)
  })

})

client.js：

socket = io(`http://localhost:${port}`, { transports: ['websocket'] })

socket.on('something', (data) => {
  doSomethingMoreWith(data)
})

fetch('/something', ....)

在这种情况下，这样做是否更安全：

io.on('connection', function(socket) {
  app.post('/something', ....)
  app.get('/something', ....)
  .....
  ...

  socket.on('disconnect', (reason) => {
    console.log('disconnected due to = ', reason)
  })

})

还是不建议这样做，有更好的选择？

Answer 1

将app.post() 和app.get() 放在io.on('connection', ...) 中绝不是正确的设计或实现。这是因为io.on('connection', ...) 被多次触发，并且一遍又一遍地添加相同的快速路由处理程序没有意义，因为这只会浪费内存并且没有任何用处。第一个在 socket.io 上连接的客户端将导致路由被注册，并且从那时起，所有其他客户端（无论它们是否通过 socket.io 连接）都会在那里。

目前尚不清楚您为什么要这样做。您不会为一种特定情况安装路线。为所有州的所有客户端安装一次路由。因此，如果您尝试有条件地安装路由，那么这种类型的设计将不起作用。如果您进一步解释您要完成的工作，那么也许我们可以为设计提出一些不同的建议。

在下面的代码中，我假设我的路由处理程序有可能会在 io 连接建立之前触发并尝试发送到套接字：

app.post('/something', (req, res) => {
  req.app.io.emit('something', doSomethingWith(req.body))
  res.status(200)
});

此代码的具体工作方式取决于 POST 执行的操作。如果它是现有页面中的 Javascript，那么该页面将已经启动并初始化，并且您可以控制（使用页面中的 Javascript 客户端代码）是否等待向/something 发出 POST 直到建立 socket.io 连接.

如果此 POST 是常规的基于浏览器的表单提交（不涉及 Javascript），那么您还有其他问题，因为来自浏览器的表单提交会使用 POST 的响应重新加载当前浏览器页面，并且在重新加载的过程中该页面会终止该页面具有的任何现有 socket.io 连接（因为它加载了一个新页面）。由于您没有从 POST 发回任何内容，这将导致浏览器中显示一个空白页面并且没有 socket.io 连接。

在查看您的客户端代码时，似乎 POST 来自客户端代码中的 fetch()（因此完全基于 Javascript）。如果是这种情况，我建议重组您的客户端代码，以便它等到 socket.io 连接完成连接后再执行fetch()。这样一来，您就知道您将能够收到服务器所做的io.emit()。

socket = io(`http://localhost:${port}`, { transports: ['websocket'] })

socket.on('something', (data) => {
  doSomethingMoreWith(data)
});

socket.on('connect', () => {
   // only issue fetch after socket.io connection is operational
  fetch('/something', ....)
});