websocket - 如何正确使用 Phoenix channel 的离开/断开连接？

Question

我正在使用 Phoenix channel 将数据流式传输到带有选项卡式界面的页面。我只想在流选项卡可见时从 channel 接收消息，并在用户切换到另一个选项卡时从 channel 断开连接。

目前我使用类似于以下代码的东西:

window.websockets_url = "ws://localhost:4000/socket";
window.channel_id = "some-channel-id"


onWindowLoad = ->
  initSocket()

onStreamShow = ->
  connectToSocket()

onStreamHide = ->
  disconnectFromSocket()


initSocket = ->
  window.socket = new (Phoenix.Socket)(window.websockets_url)

connectToSocket = ->
  window.socket.connect()
  channel = window.socket.channel("channel:#{window.channel_id}", {})
  channel.join()
  channel.on "event", (payload) ->
    doSomethingWithThePayload(payload)

disconnectFromSocket = ->
  window.socket.disconnect()

这有效，但在调用 connectToSocket() 之后和 disconnectFromSocket()我多次在服务器日志中收到此消息:

StreamChannel received join event with topic "channel:some-channel-id" but channel already joined

我怎样才能避免这种情况？

Answer 1

Javascript 中的 Phoenix Socket API 是有状态的。断开连接后重新连接时，它将重新连接到所有以前的 channel 。然后您将第二次加入 channel 。

您可以重新初始化套接字 (initSocket) 或仅在第一次连接时加入 channel 。