Question

我有一个基本的聊天应用程序，可以通过ActionCable发送消息。我正在尝试根据发送者的不同来对消息进行左右排序，这与Facebook的Messenger应用程序非常相似。我正在尝试通过发送的部分（_message.html.erb）中的基本逻辑来实现此目标：

<%if message.user_id == current_user.id %> 
//message is to the right with inline CSS
<% else°%>
// message is to the left with inline CSS
<% end°%>

如果有人重新加载页面，效果很好，但是当使用该应用程序时，通过ActionCable发送的所有新消息都会发送到右侧。

我检查了发送的部分内容，看来

<%if message.user_id == current_user.id %>

在用户端运行，然后总是发送部分的第一部分，而不发送整个_message.html.erb。有没有一种方法可以代替发送整个部分，并确保

<%if message.user_id == current_user.id %>

在所有订阅的用户收到邮件时运行？

消息控制器：

if @message.save
  RoomChannel.broadcast_to @room.id, message: 
  MessagesController.render(partial: 'messages/message', locals: {message: 
  @message, current_user: current_user})

room.js：

received: function (data) {
    $('.messages').append(data.message);
}

如果需要代码的其他部分，请询问或：https://github.com/TTARJAN/chatApp

Answer 1

因此，我最终制作了两个部分，并使用Actioncable广播了它们，然后让JQuery在接收的函数中确定要呈现的部分。而且，每个用户的ID都作为数据存储在html中以进行比较。下面的代码：

 var userId = $('#noBGR').attr('data-user-id');
    if (parseInt(userId) === data.id){
        $('.messages').append(data.msg_user);
    }else{
        $('.messages').append(data.message);
    }


RoomChannel.broadcast_to @room.id, id: @message.user_id, message: 
MessagesController.render(partial: 'messages/message', locals: {message: @message, 
current_user: current_user}), msg_user: MessagesController.render(partial: 
'messages/message_user', locals: {message: @message, current_user: current_user})

使用ActionCable

1 个答案: