如何使用 socket.io 将所有客户端重定向到另一个页面？

Question

我正在开发一款在线多人卡牌反人类游戏（前面是 React，用于重定向的 React 路由器，后面是 Node）我试图在大厅中的一个用户时重定向“大厅”或房间中的所有客户端点击“开始”，但现在只有点击开始的用户被重定向。

这个想法是有人会设置一个新游戏，它会有一个独特的图钉，在你创建游戏并选择你的头像后，其他人可以使用该图钉加入大厅（这部分工作正常，大厅中的用户为所有用户实时更新），并且只有创建游戏的人才能在所有用户加入后点击“开始”按钮开始游戏，这应该重定向大厅中的所有用户。

在客户端，在大厅组件的构造函数中，我有

   socket.on("start game", () => {
      this.props.history.push(`/${this.props.match.params.pin}`);
    });

对于有权访问开始按钮的一个用户，单击它时会触发以下内容

socket.emit("start");

然后进入后端

   socket.on('start', () => { 
        socket.emit('start game');
    })

但只有点击开始的用户被重定向，我似乎无法弄清楚这一点。

这是我第一次尝试实现套接字，我不太确定我在这里会遗漏什么

Answer 1

服务器需要向您想要重定向的每个用户发送一条 socket.io 消息，并提供他们应重定向到的 URL。每个客户端都应该有一个该 socket.io 消息的侦听器，当它们收到该消息时，它们会设置window.location为新的 URL 以引起重定向。

因此，服务器会向每个应该重定向的客户端发送类似这样的内容：

socket.emit('redirectToNewGame', newGameURL);

其中套接字是应重定向的每个用户的套接字。

然后，每个客户端都会有这样的代码：

socket.on('redirectToNewGame', newGameURL => {
    // redirect to new URL
    window.location = newGameURL;
});

如果整个过程是由用户单击自己窗口中的按钮启动的，则该用户会向服务器发送一条消息以启动整个过程。当服务器收到该消息时，它会通过向每个客户端发送 socket.io 消息来通知应遵循该重定向的特定客户端集。

您的服务器如何准确跟踪哪些客户端应该重定向到该 URL 由您的设计决定。在 socket.io 的服务器端，通常使用 rooms 来实现这一点，但也可以用您自己的代码来完成。这只是应用程序设计的一部分，以及用户在整个过程之前会合的方式。