javascript - 如何在页面加载后订阅 channel - ActionCable、DelayedJob

Question

我有一个带有后台作业的 Controller 来启动 ActionCable 订阅:

  def result
    LinkBroadcastJob.perform_later(links)
  end

它执行此操作来流式传输链接:

  def perform(links)
      links.each do |link|
          ActionCable.server.broadcast "link_channel", html: render_link(link)
      end
  end

我在布局中有一个带有 div id="here"的 View 。

在我的文件 javascript/channes/link.coffee.js 中，它应该将所有链接附加到 div。

  App.link = App.cable.subscriptions.create { channel: "LinkChannel" },
    received: (data) ->
        $("#here").append(data.html)

此代码的问题是订阅在页面完全加载之前开始 - 因此第一个链接不会显示并且丢失。

我可以通过延迟作业和一些设定时间(5秒)来解决它，但这不是最好的体验，我不知道用户加载整个页面需要多快。我也尝试在创建订阅之前使用 $(document).load 进行操作，但没有成功。

加载 div 标签后执行订阅的最佳方式是什么？

Answer 1

您应该将客户端代码放入 turbolinks:load 中:

jQuery(document).on 'turbolinks:load', ->
   App.link = App.cable.subscriptions.create { channel: "LinkChannel" },
     received: (data) ->
         $("#here").append(data.html)