Question

我正在构建一个聊天应用程序，并且有一个错误，当您键入消息时，它会显示两条消息而不是一条消息，但是当我重新加载页面时，重复消息会消失。有人可以告诉我这是什么问题吗？谢谢！

Javascript角/信道/ room.coffee

App.room = App.cable.subscriptions.create "RoomChannel",
  connected: ->
    # Called when the subscription is ready for use on the server

  disconnected: ->
    # Called when the subscription has been terminated by the server

  received: (data) ->
    # Called when there's incoming data on the websocket for this channel
    $messages = $('#messages')
    $messages.append data
    $messages.scrollTop $messages.prop('scrollHeight')

  speak: (message) ->
    @perform 'speak', message: message

的javascript / rooms.coffee

# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://coffeescript.org/
$ ->
  $messages = $('#messages')
  $messages.scrollTop $messages.prop('scrollHeight')
  $('#message_input').focus()

$(document).on 'keypress', '#message_input', (e) ->
  if e.keyCode == 13 and e.target.value
    App.room.speak(e.target.value)
    e.target.value = ''
    e.preventDefault()

通道/ application_cable / connection.rb

module ApplicationCable
  class Connection < ActionCable::Connection::Base
    identified_by :current_user

    def connect
      self.current_user = find_verified_user
      logger.add_tags 'ActionCable', current_user.email
    end

    protected
    def find_verified_user
      if (current_user = User.find_by_id cookies.signed['user.id'])
        current_user
      else
        reject_unauthorized_connection
      end
    end



 end
end

房间控制器

class RoomsController < ApplicationController
  before_action :authenticate_user!
  def show
    @messages = Message.all

  end
end

room_channel.rb

class RoomChannel < ApplicationCable::Channel
  def subscribed
    stream_from "room_channel"
  end

  def unsubscribed
    # Any cleanup needed when channel is unsubscribed
  end

  def speak(data)
    Message.create content: data['message'], user: current_user
  end
end

查看_message.html.erb

<div class="message">
    <a href="" class="message_profile-pic"></a>
    <h2><a href="" class="message_username"><%= link_to  message.user.email, message.user %></a></h2>
    <div class="form-group">

          <div class="col-sm-6">

<span class="user-menu_profile-pic"><%= image_tag message.user.avatar.url(:thumb), class: 'col-sm-2 control-label' %></span>
</div>
</div>
<span class="message_timestamp">
<%= message.created_at %>
</span>
<span class="message_star"></span>
<span class="message_content">
  <%= message.content %>
</span>
</div>

房间show.html.erb

    <% content_for :title, 'admin | Action Cable Chat' %>
    <div class="header">
      <div class="team-menu">ActionCable</div>

          <h2 class="listings_header">Direct Messages</h2>
          <ul class="channel_list">
            <li class="channel">
              <a class="channel_name"><span class="unread">20</span><span><span class="prefix"> </span>dhh@basecamp.com</span></a>
            </li>
          </ul>
        </div>
      </div>
      <div class="message-history" id="messages">
        <%= render @messages %>
      </div>
    </div>
    <div class="footer">
      <div class="user-menu">
    <span class="user-menu_username"><%= link_to current_user.email, current_user %></span>
    <span class="user-menu_username"><%= image_tag current_user.avatar.url(:thumb)  %></span>
        <span class="connection_status">online</span>
        <span class="logout"><%= link_to('Logout', destroy_user_session_path, :method => :delete) %></span>
      </div>
      <div class="input-box">
        <input type="text" class="input-box_text" id="message_input"/>
      </div>
    </div>


<% content_for :title, 'admin | Action Cable Chat' %>
<div class="header">
  <div class="team-menu">ActionCable</div>

      <h2 class="listings_header">Direct Messages</h2>
      <ul class="channel_list">
        <li class="channel">
          <a class="channel_name"><span class="unread">20</span><span><span class="prefix"> </span>dhh@basecamp.com</span></a>
        </li>
      </ul>
    </div>
  </div>
  <div class="message-history" id="messages">
    <%= render @messages %>
  </div>
</div>
<div class="footer">
  <div class="user-menu">
<span class="user-menu_username"><%= link_to current_user.email, current_user %></span>
<span class="user-menu_username"><%= image_tag current_user.avatar.url(:thumb)  %></span>
    <span class="connection_status">online</span>
    <span class="logout"><%= link_to('Logout', destroy_user_session_path, :method => :delete) %></span>
  </div>
  <div class="input-box">
    <input type="text" class="input-box_text" id="message_input"/>
  </div>
</div>

Answer 1

你需要禁用turbolinks 删除宝石＆＃39; turbolinks＆＃39;你的Gemfile中的一行。从app / assets / javascripts / application.js中删除// = require turbolinks。删除两个＆＃34;数据 - turbolinks-track＆＃34; =＆GT;来自app / views / layouts / application.html.erb的真实哈希键/值对。完成！

Answer 2

您需要禁用Turbolinks从Gemfile中删除gem'turbolinks'行。从您的app / assets / javascripts / application.js中删除// = require涡轮链接。从您的app / views / layouts / application.html.erb中删除两个“ data-turbolinks-track” =>真正的哈希键/值对。完成！

如何防止actioncable消息显示两次？

2 个答案: