ActionCable-Rails-React: сообщения не загружаются, и консоль показывает «Приложение не определено» - PullRequest
Новая
       25

ActionCable-Rails-React: сообщения не загружаются, и консоль показывает «Приложение не определено»

0 голосов
/ 27 апреля 2020

Создание приложения для чата с Rails и React, попытка реализовать ActionCable для обновлений в реальном времени. Приложение построено, и обмен сообщениями работает с setInterval. Ошибка консоли: «Uncaught ReferenceError: Приложение не определено». Этот фрагмент кода находится внутри моего контейнера message_list.jsx и специально вызывает разрыв приложения. Любая помощь будет принята с благодарностью. 

componentDidMount() { // For the first channel
    this.subscribeActionCable(this.props);
  }

subscribeActionCable = (props) => {
    App[`channel_${props.selectedChannel}`] = App.cable.subscriptions.create(
      { channel: 'ChannelsChannel', name: props.selectedChannel },
      {
        received: (message) => {
          if (message.channel === props.selectedChannel) {
            props.appendMessage(message);
          }
        }
      }
    );
  }

1 Ответ

0 голосов
/ 28 апреля 2020

Я смог решить проблему и хотел задокументировать это для других. Я использую rails6 + webpacker с кабелем реакции и действия для приложения чата. Весь интерфейс реакции находится в папке 'javascript' вне конвейера ресурсов. Возможно, вы использовали setInterval для обновления sh сообщений, и теперь у вас возникают проблемы с настройкой кабеля действий. Если вы настроили все остальное правильно, и у вас появляется консольная ошибка, в которой «Приложение не определено» и сообщения не загружаются, это может помочь.

  1. добавление javascript_include_tag к представлениям / макетам /application.html.erb
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>Rails React Chat</title>
    <%= csrf_meta_tags %>
    <%= action_cable_meta_tag %>
    <%= stylesheet_link_tag 'application', media: 'all' %>
    <%= stylesheet_pack_tag 'application', media: 'all' %> <!-- Uncomment if you import CSS in app/javascript/packs/application.js -->
  </head>
  <body>
    <%= render 'shared/navbar' %>
    <%= render 'shared/flashes' %>
    <%= yield %>
    <%= javascript_include_tag 'application' %>
    <%= javascript_pack_tag 'application' %>
    <%= yield :after_js %>
  </body>
</html>
если отсутствует, добавьте папку javascripts в конвейер ресурсов и настройте приложение. js ... 
//= require rails-ujs
//= require_tree .

и кабель. 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 .

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

  App.cable = ActionCable.createConsumer();

}).call(this);
настроить манифест. js правильно 
//= link_tree ../images
//= link_directory ../javascripts .js
//= link_directory ../stylesheets .css
...