rails6で作成中のチャットアプリがリアルタイム更新されない

Question

リアルタイムでメッセージを表示させたい

『【Rails6.0】ActionCableとDeviseの欲張りセットでリアルタイムチャット作成(改正版)』
https://qiita.com/eRy-sk/items/4c4e983e34a44c5ace27

この記事を参考にrailsでコミュニティー型のsnsをつくっています。
そして、これにコミュニティ作成機能を追加しました。

メッセージがフロントに表示されない

サーバーにデータは保存されているようなのですが、
送信されたメッセージが表示されなくて困っています。

コミュニティ作成機能を追加して、
作成したコミュニティ内でメッセージ送信後の挙動を確認してみたところ
メッセージがリアルタイムで更新されなくなってしまいました。

コミュニティー作成を行う前までは、ちゃんと動いていました、、

該当のソースコード

app/channels/community_channel.rb

class CommunityChannel < ApplicationCable::Channel
  def subscribed
    stream_from "community_channel_#{params['community']}"
  end

  def unsubscribed
    # Any cleanup needed when channel is unsubscribed
  end

  def speak(data)
    Message.create! content: data['message'], user_id: current_user.id, community_id: params['community']
  end
end

app/javascript/channels/community_channel.js

import consumer from './consumer'

$(function() {
  const chatChannel = consumer.subscriptions.create({ channel: 'CommunityChannel', community: $('#messages').data('community_id') }, {
    connected() {
      // Called when the subscription is ready for use on the server
    },

    disconnected() {
      // Called when the subscription has been terminated by the server
    },

    received: function(data) {
      return $('#messages').append(data['message']);
    },

    speak: function(message) {
      return this.perform('speak', {
        message: message
      });
    }
  });

// data-behaviorがcommunity_speakerである場所でkeypressすると...
  $(document).on('keypress', '[data-behavior~=community_speaker]', function(event) {
    if (event.keyCode === 13) {
      chatChannel.speak(event.target.value);
      event.target.value = '';
      return event.preventDefault();
    }
  });
});

app/jobs/message_broadcast_job.rb

class MessageBroadcastJob < ApplicationJob
  queue_as :default

  def perform(message)
    # Do something later
    ActionCable.server.broadcast "commnity_channel_#{message.community_id}",  message: render_message(message)
  end

  private

  def render_message(message)
    ApplicationController.renderer.render partial: 'messages/message', locals: { message: message }
  end
end

app/views/communities/show.html.erb

<div id='messages' data-community_id="<%= @community.id %>">
  <%= render @messages %>
</div>

<%= label_tag :content, @community.name %>
<%= text_field_tag :content, nil, data: { behavior: 'community_speaker' } %>

app/views/messages/_message.html.erb

<div class='message'>
  <p><%= "#{message.user.email}: #{message.content}" %></p>
</div>

やってみたこと。

turbolinksを削除した。

Answer 1

スペルミスでした。
以下のように変更しました。

class MessageBroadcastJob < ApplicationJob
  queue_as :default

  def perform(message)
    # Do something later
    ActionCable.server.broadcast "community_channel_#{message.community_id}",  message: render_message(message)
  end

  private

  def render_message(message)
    ApplicationController.renderer.render partial: 'messages/message', locals: { message: message }
  end
end