HotwireとRailsでroom単位のブロードキャストを行う

前提

• Rails 7.0.0.alpha2

書いてあること

以下の記事の続きで、今度はroom単位でmessageをブロードキャストする。
https://zenn.dev/knt45/articles/0da340c4515a2a

ステップ1 message

ソースコード

app/controllers/messages_controller.rb

class MessagesController < ApplicationController
  (略)

  def create
    room = Room.find(params[:room_id])
    message = params[:message]
    Turbo::StreamsChannel.broadcast_replace_to room, target: 'new_message', partial: 'messages/message', locals: { message: message }
    redirect_to new_message_path
  end
end

app/views/messages/new.html.erb

<%= form_with url: messages_path, methhod: :post do |form| %>
  <%= form.text_field :room_id %>
  <%= form.text_field :message %>
  <%= form.submit %>
<% end %>

ポイント

messageを入力する際、room_idも一緒に入力して、broadcast_replace_toの対象のストリームにroomインスタンスを設定する。それ以外は前回と特に違いはない。

ステップ2 room

ソースコード

app/controllers/rooms_controller.rb

class RoomsController < ApplicationController
  (略)

  def show
    @room = Room.find(params[:id])
  end
  
  (略)
end

app/views/rooms/show.html.erb

<%= turbo_stream_from @room %>

<%= turbo_frame_tag 'new_message' do %>
  ここがreplaceされる
<% end %>

ポイント

scaffoldでroomのCRUDを適当に作成して、showページにturbo_stream_fromでroomインスタンスを設定する。先ほどはmessageという固定文字列だったが、roomインスタンスをストリームに設定することでroom単位でブロードキャストできるようになる。

所感

broadcast_replace_toではなくbroadcast_prepend_toやbroadcast_append_toを使って、ターゲットを変更すれば、messegeの差し替えではなく冒頭や末尾への追加も可能。