I am trying to add an instant messaging function to my Rails 7 app. I keep getting the following error:
Started GET "/cable" [WebSocket] for ::1 at 2023-04-25 03:28:15 +0100
Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket)
Subscription class not found: "ConversationsChannel"
I have this in app/channels/conversation_channel.rb:
class ConversationsChannel < ApplicationCable::Channel
def subscribed
conversation = Conversation.find(params[:conversation_id])
stream_for conversation
end
end
My div for displaying the conversation:
<div class="well w-full md:ml-5 flex-1 h-4/5" data-channel-subscribe="conversations" data-conversation-id="<%= @conversation.id %>">
#rest of html
</div>
Javascript:
import consumer from "/channels/consumer";
$(function() {
$('[data-channel-subscribe="conversations"]').each(function(index, element) {
var $element = $(element),
conversation_id = $element.data('conversation-id'),
messageTemplate = $('[data-role="message-template"]');
consumer.subscriptions.create(
{
channel: "ConversationsChannel",
conversation_id: conversation_id
},
{
received: function(data) {
if (data.sender_id === gon.current_user_id) {
var ul = document.getElementById("list");
var li = document.createElement("li");
li.classList.add('me');
li.appendChild(document.createTextNode(data.body));
ul.appendChild(li);
} else {
var ul = document.getElementById("list");
var li = document.createElement("li");
li.classList.add('him');
li.appendChild(document.createTextNode(data.body));
ul.appendChild(li);
}
document.getElementById('body').value = ''
var objDiv = document.getElementById("messages-scroll");
$("#messages-scroll").scrollTop($("#messages-scroll")[0].scrollHeight);
}
}
);
});
});
Am I missing something obvious? I can’t figure it out so any help would be appreciated. Thanks in advance.