Rails 6 - 动作电缆问题

Question

我对 Ruby 有点陌生，我正在构建一个非常简单的 Rails 应用程序，它允许使用 Action Cable 进行聊天类型的功能。 我正在关注的教程没有使用 rails 6，所以在我构建它时有点不同，但是除了下面的 jQuery 来启动 Action Cable 连接之外，此时似乎一切都在工作。 我在 cable.js 文件中收到一个控制台错误，指出“Uncaught ReferenceError: App is not defined”。 这是有史以来第一次使用 Action Cable 和 Rails，因此非常感谢任何帮助。

这是我的 git repo 的链接： https : //github.com/scottlandes1217/Hubbubb

电缆.js

// Action Cable provides the framework to deal with WebSockets in Rails.
// You can generate new channels where WebSocket features live using the `rails generate channel` command.
//
//= require action_cable
//= require_self
//= require_tree ./channels

(function() {
  this.App || (this.App = {});

  App.cable = ActionCable.createConsumer();

}).call(this);

论坛频道.js

$(function() {
  $('[data-channel-subscribe="forum"]').each(function(index, element) {
    var $element = $(element),
        forum_id = $element.data('forum-id')
        messageTemplate = $('[data-role="message-template"]');

    $element.animate({ scrollTop: $element.prop("scrollHeight")}, 1000)

    App.cable.subscriptions.create(
      {
        channel: "ForumChannel",
        forum: forum_id
      },
      {
        received: function(data) {
          var content = messageTemplate.children().clone(true, true);
          content.find('[data-role="user-avatar"]').attr('src', data.user_avatar_url);
          content.find('[data-role="message-text"]').text(data.message);
          content.find('[data-role="message-date"]').text(data.updated_at);
          $element.append(content);
          $element.animate({ scrollTop: $element.prop("scrollHeight")}, 1000);
        }
      }
    );
  });
});

Answer 1

你看过作者Github repo吗？ 我不是 jQuery 专家，但您似乎遗漏了一些东西。

Answer 2

这仍然是一个不完整的答案：

我也有问题，因为所有教程都是针对 Rails 5.x 的，cable.js 文件来自 rails 5 时代。 rails 6 附带一个 app/javascripts/consumer.js 文件，您应该删除或移动所有 app/assets/javascripts。

我相信我们不需要包含 jQuery。 它已被删除。

Answer 3

在玩了相当多的 Action 电缆之后，我找不到一个简单的解决方案。 我继续前进，只是降级到 rails 5，一切似乎都运行良好。 我知道这不是真正的答案，但至少我能够完成该项目。