首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何防止actioncable消息显示两次?

如何防止actioncable消息显示两次?
EN

Stack Overflow用户
提问于 2017-05-08 09:43:22
回答 2查看 1.4K关注 0票数 3

我正在构建一个聊天应用程序,并有一个bug,当你键入一条消息时,它会显示两条消息而不是一条,但当我重新加载页面时,重复的消息就消失了。有人能告诉我问题出在哪里吗?谢谢!

javascripts/channel/room.cafee

代码语言:javascript
复制
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.cafee

代码语言:javascript
复制
# 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()

channels/application_cable/connection.rb

代码语言:javascript
复制
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

房间控制器

代码语言:javascript
复制
class RoomsController < ApplicationController
  before_action :authenticate_user!
  def show
    @messages = Message.all

  end
end

room_channel.rb

代码语言:javascript
复制
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

代码语言:javascript
复制
<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

代码语言:javascript
复制
    <% 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>
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2018-07-25 04:58:29

您需要禁用turbolinks,从Gemfile中删除gem的“turbolinks”行。从应用程序/assets/javascripts/application.js中删除//= require turbolinks。从应用程序/视图/布局/应用程序.html.erb中删除两个"data-turbolinks-track“=>真正的散列键/值对。完成了!

票数 -2
EN

Stack Overflow用户

发布于 2017-05-20 05:05:37

您需要禁用turbolinks,从Gemfile中删除gem的“turbolinks”行。从应用程序/assets/javascripts/application.js中删除//= require turbolinks。从应用程序/视图/布局/应用程序.html.erb中删除两个"data-turbolinks-track“=>真正的散列键/值对。完成了!

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/43838578

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档