如何将 Socket.IO 与 NUXT 3 结合使用？

Question

我想将 Socket.IO 与我的 Nuxt 3 应用程序一起使用，以便 Nuxt 应用程序和 Socket.IO 服务器共享相同的端口，并且一旦 Nuxt 应用程序准备就绪，Socket.IO 服务器就会自动启动。

\n

我探索了五种不同的解决方案，但它们都有各自的缺点：

\n

解决方案 1：使用nuxt-socket-io。在这里，自述文件提到了一种让模块与 Nuxt 3 和更新的 Socket.io 版本一起使用的解决方法，但是该解决方法会导致 404 页面，因为存储库的作者完全禁用了这些问题，并且似乎没有维护该模块不再有。

\n

TL; 博士：不起作用，没有支持。

\n

解决方案 2：使用nuxt3-socket.io。~~这会产生此错误。~~

\n

更新（2024 年 1 月）：该模块目前似乎在开发和生产中都运行良好，并且非常易于使用。但是，我目前无法热重载（socket.io 服务器）来使用此解决方案，即使在修改文件时硝基会重新加载。我希望这个问题能够得到解决。

\n

这个问题表明存在潜在的兼容性问题，但我无法重现（在 macOS 上）。

\n

TL; dr：效果很好，易于使用，但没有（socket.io 服务器的）热重载，并且可能无法在每个平台上工作。（这是我目前首选的解决方案）

\n

解决方案 3： \n使用 Nuxt 中间件启动 Socket.io 服务器，如此处所述。 \n此方法通常有效，但 Socket.io 服务器在请求“/ws”路由之前不会启动，因此需要额外的客户端代码。

\n

太棒了；通常可以工作，但 Socket.io 不会自动启动。

\n

解决方案 4： \n使用带有监听钩子的 Nuxt 插件，如此处所述。在开发过程中，这正是我想要的。但是，由于仅在开发模式下调用侦听挂钩，而在生产模式下不会调用，因此 Socker.io 服务器在生产中不会运行。

\n

TL; 博士：有效，但仅限于开发阶段。

\n

解决方案 5： \n将 Socket.io 放在不同的端口上，但使用 http-proxy，将所有内容代理到一个端口，如此处所述。 \n这似乎是迄今为止最好的解决方案。然而，这种方法似乎会导致加载时间更长，尤其是在开发中。

\n

TL; 博士：工作正常，但看起来很慢。

\n

更新：解决方案 6 \n根据用户 swooshi 和 Agustin Nu\xc3\xb1ez 的建议，使用自定义硝基条目文件的解决方案（如此处所述）似乎运行良好。然而，由于它基本上取代了硝基条目，因此每次更改硝基版本时可能都必须调整此解决方法。

\n

TL; 博士：工作正常，需要经常维护。

\n

所以我的问题是： \n是否有一种简单的方法可以让 Socket.io 服务器自动启动并侦听与我缺少的 Nuxt 应用程序相同的端口？

\n

Answer 1

我不知道这是否是一个好主意，但可以尝试创建自己的硝基预设和条目文件，就像我在这里所做的那样https://github.com/sush1lemon/nuxt-socket.io