rails_actioncable_chat_room_broadcast_with_user_auth.rb

1# 1. Define the Connection (app/channels/application_cable/connection.rb)
2module ApplicationCable
3  class Connection < ActionCable::Connection::Base
4    identified_by :current_user
5
6    def connect
7      self.current_user = find_verified_user
8    end
9
10    private
11      def find_verified_user
12        if verified_user = User.find_by(id: cookies.encrypted[:user_id])
13          verified_user
14        else
15          reject_unauthorized_connection
16        end
17      end
18  end
19end
20
21# 2. Define the Channel (app/channels/chat_channel.rb)
22class ChatChannel < ApplicationCable::Channel
23  def subscribed
24    stream_from "chat_#{params[:room]}"
25  end
26
27  def receive(data)
28    ActionCable.server.broadcast("chat_#{params[:room]}", data)
29  end
30end
31
32# 3. Client-Side Subscription (app/javascript/channels/chat_channel.js)
33import consumer from "./consumer"
34
35consumer.subscriptions.create({ channel: "ChatChannel", room: "Best Room" }, {
36  received(data) {
37    this.appendLine(data)
38  },
39
40  appendLine(data) {
41    const html = this.createLine(data)
42    document.querySelector("[data-chat-room='Best Room']").insertAdjacentHTML("beforeend", html)
43  },
44
45  createLine(data) {
46    return `
47      <article class="chat-line">
48        <span class="speaker">${data["sent_by"]}</span>
49        <span class="body">${data["body"]}</span>
50      </article>
51    `
52  }
53})
54
55# 4. Broadcasting from the Server (e.g., from a Controller or Job)
56# ActionCable.server.broadcast("chat_Best Room", {
57#   sent_by: "Paul",
58#   body: "This is a cool chat app."
59# })