Rails ActionCable / turbollinks聊天问题:发布重复消息

Question

我有一个问题与ActionCable和turbollinks。我已经建立了一个聊天应用程序类似的例子聊天应用程序由DHH共享。

为了拥有多个聊天室并将聊天室ID传递给ActionCable订阅初始化器，我有这样的东西:

$(document).on("turbolinks:load",function(){
  var pod_slug = $("#pod_slug_value").val();
  App.pods = App.cable.subscriptions.create(
    { channel: 'PodsChannel', pod_slug: pod_slug },
    {
    received: function(data) {
      if ( $(".chat-stream").length ){
        $(data.message).appendTo($(".chat-stream"));
        $(".chat-stream").scrollTop($(".chat-stream")[0].scrollHeight);
      }
    },
    speak: function(message, pod_slug) {
      return this.perform('speak',{
        message: message,
        pod_slug: pod_slug
      });
    }
  });
  // captures text input from input field
  captureMessage();
});

然而，当我点击应用程序周围并返回页面时，turbollinks似乎多次绑定订阅处理程序，现在当我提交消息时，我在聊天流中得到重复的消息。

我试过用各种方法来划分这个问题。当我不以:

作为订阅处理程序的开头时，我没有遇到这个问题。

$(document).on("turbolinks:load",function(){...

但是我无法获得聊天室id (pod_slug)，因为文档DOM在javascript执行之前没有加载。

这个问题似乎有一个简单的解决方案，因为ActionCable和turbolink都是由Basecamp大力支持的。许多演示聊天教程建议以这种方式设置聊天。我遗漏了什么吗?

Answer 1

我有同样的问题，并以这种方式修复它

if (!App.pods) {
  App.pods = App.cable.subscriptions.create(
   { channel: 'PodsChannel', pod_slug: pod_slug },
   { ... /* and so on */ }
}

每次你重新加载页面，' turbollinks:load'事件工作，所以你必须检查App.pods对象是否已经创建。

Answer 2

可以使用App.cable.subscriptions.remove删除由App.cable.subscriptions.create返回的订阅。所以检查App.pods是否设置，如果设置了，在再次订阅之前删除它。

Answer 3

我喜欢你的方法，MaruniakS。深入到消费者对象中，它似乎有一个测试来查看它是否断开了连接。只改变第一行，我们还可以这样做:

if (!App.pods || App.pods.consumer.connection.disconnected) {
  App.pods = App.cable.subscriptions.create(
    { channel: 'PodsChannel', pod_slug: pod_slug },
    { ... /* and so on */ }
}