如何在不丢失套接字连接的情况下将用户导航到网站中的其他页面？

Question

我想使用 socket.io 和 express 构建一个简单的 Web 应用程序，该网站将包括 2 个页面： （房间页面和房间页面）。 房间页面是用户需要插入他的名字的地方，他可以创建自己的房间或从房间列表中加入现有房间。 在房间页面上，我想等待 2 个用户，然后显示一个琐事问题。

如何在不丢失套接字连接的情况下将用户从 rooms 页面重定向到 room 页面？当我尝试使用带有“href”属性的 HTML 标记“a”时，它不起作用。 我猜是因为页面正在重新加载，所以我怎样才能导航到其他页面并保持套接字连接打开？

Answer 1

您刚刚描述了单页应用程序框架如此受欢迎的一个关键原因 - 您可以更改用户的视图，而无需重新加载或中断与服务器的数据连接。

在您的示例中，一旦您从服务器请求另一个页面，socket.io 连接就会断开，然后在下一页准备好时重新连接。您可以使用 console.log 语句来确认此行为。

所以不，除非您开始考虑使用框架或 iframe 分隔页面的变通方法，或者客户端上的时间戳可以“赶上”新加载的页面，否则使用 E​​xpress 是不可能的。两者都不是好选择。

React、Angular 和 Vue 是三个最流行的 SPA 框架，如果您的应用程序足够先进，需要持续的 socket.io 连接，那么您很有可能会从其中一个中受益。