我知道有很多关于这个问题的帖子,但大多数都很旧,没有一个包括ActionCable。所以挑战来了:
我正在用ActionCable构建一个聊天功能,消息广播成功,消息也立即呈现给接收者,但在发送者端,像往常一样呈现一个空白页面来发送请求(message create form)。我正在接收一个status code of 200
,我在我的message create方法中触发它,但我显然想留在同一个页面上,并通过JS插入HTML(使用JS的刺激)。
app/views/chats/show.html.erb -创建消息的表单
<%= simple_form_for [@chat, @message], remote: true,
html: {
class: 'chat__form',
data: {
action: "turbo:submit-end->chat-subscription#resetForm"
}
} do |f| %>
<%= f.input :content,
label: false,
placeholder: "Message ##{@name}",
input_html: { class: 'chat__form-input' } %>
<%= button_tag(class: 'chat__form-button') do %>
<%= image_tag('icons/send.svg') %>
<% end %>
<% end %>
app/controllers/messages_controller.rb -创建方法
def create
@chat = Chat.find(params[:chat_id])
@message = Message.new(message_params)
@message.chat = @chat
@message.user = current_user
if @message.save
ChatChannel.broadcast_to(
@chat,
render_to_string(partial: "messages/message", locals: {message: @message})
)
head :ok
end
end
app/javascript/controllers/chat_subscription_controller.js
import { Controller } from "@hotwired/stimulus"
import { createConsumer } from "@rails/actioncable"
export default class extends Controller {
static values = { chatId: Number }
static targets = ['messages', 'form']
connect() {
this.channel = createConsumer().subscriptions.create(
{ channel: 'ChatChannel', id: this.chatIdValue },
{ received: data => this.#insertMessageAndScrollDown(data) }
)
console.log(`Subscribed to the chat with the id ${this.chatIdValue}.`)
console.log(this.messagesTarget)
}
#insertMessageAndScrollDown(data) {
this.messagesTarget.insertAdjacentHTML('beforeend', data)
this.messagesTarget.scrollTo(0, this.messagesTarget.scrollHeight)
}
resetForm(event) {
event.preventDefault()
event.target.reset()
}
disconnect() {
console.log('Unsubscribed from the chat')
this.channel.unsubscribe()
}
}
就像我说的-它在接收器端完美地工作。因此,我可以确保频道设置正确,我的JS方法也工作。我认为遥控器:true没有触发,表单正在本地提交。我只是不知道我的设置缺少了什么。我相信因为我使用Vite而不是Webpacker,所以有些设置不正确。但我也找不到任何资源。
那Redis呢,它是怎么起作用的?
1条答案
按热度按时间qij5mzcb1#
我给了它一个快速的尝试,这是一个工作设置:
大概就是这样,也许你缺少
turbo-rails
gem,所以服务器无法识别 TURBO_STREAM 格式,请检查rails控制台:一个三个三个一个