如何在 Chrome 中使用本机 WebSocket 库重新连接套接字

Question

我有这个：

<script>

  const socket = new WebSocket('ws://localhost:3702');    

  socket.addEventListener('open', function (event) {
    console.log('connection made to server:', event);
  });

  socket.addEventListener('message', function (event) {
    console.log('ws client received message:', event);
    location.reload();
  });

</script>

如果服务器重新启动，它不会自动重新连接。重新连接到服务器的最佳方法是什么？

Answer 1

所以看起来没有重新连接选项，这对于较低级别的库来说是有意义的。此重新连接逻辑运行良好：

  const createConnection = () => {

    const socket = new WebSocket('ws://localhost:3702');

    socket.addEventListener('open', function (event) {
      console.log('connection made to server:', event);
    });

    socket.addEventListener('close', function (event) {
      console.log('connection closed:', event);
      socket.close();
      setTimeout(createConnection, 2500);  // reconnect here
    });

    socket.addEventListener('message', function (event) {
      console.log('ws client received message:', event);
      location.reload();
    });

  };

一旦连接关闭（'close' 事件发生，因为服务器重新启动），然后我们等待 2.5 秒，然后尝试重新连接。如果重新连接失败，关闭事件会重新触发，所以我们只需在 2.5 秒后重试。

Answer 2

您需要检测连接关闭事件并编写一个reconnect函数来尝试重新连接到服务器：

socket.addEventListener('close', function (event) {
    console.log('Disconnected!');
    reconnect(); //----------> tries to reconnect through the websocket
  });

请注意，关闭事件可能需要很长时间才能触发。在这种情况下，您可以实现一个简单的乒乓方法，如 here 所述，以检测连接断开（而不是关闭事件）。

您可以找到 reconnect 函数的简单实现 here。

如何在 Chrome 中使用本机 WebSocket 库重新连接套接字

How to reconnect a socket using native WebSocket library in Chrome

sockets

google-chrome

reconnect

websocket

node.js