无法理解 ActionCable

Trouble understanding ActionCable

几天来我一直在研究 ActionCable,但我发现很难理解如何使用它。查看各种示例后,观看 YouTube 视频 并阅读了一些 Ruby 边缘指南我仍然不确定如何将它实施到我的项目中。

我想要做的是从我的广播 table 中获得前 20 个结果,并将它们从 application.html.erb 中放入 'feed' div 中div:

的代码
<div class="content">
  <div id="feed">
    <h1>TEST</h1>
  </div>
  <%= yield %>
</div>

我已将此添加到我的 'routes.rb':

mount ActionCable.server => '/cable'

这是'feeds.coffee':

App.feeds = App.cable.subscriptions.create "FeedsChannel",
  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) -> 
    $(".content #feed").append(data);
    # Called when there's incoming data on the websocket for this channel

这里是'feeds_channel.rb':

# Be sure to restart your server when you modify this file. Action Cable runs in a loop that does not support auto reloading.
class FeedsChannel < ApplicationCable::Channel
  def subscribed
        messages = Broadcast.all
       stream_for messages
       ActionCable.server.broadcast("FeedsChannel", messages.last(20))
  end

  def unsubscribed
    # Any cleanup needed when channel is unsubscribed
  end
end

我显然在这里做了一些愚蠢的事情,不知道在哪里。这是 控制台输出

的打印输出
=> Booting Puma
=> Rails 5.0.0.1 application starting in development on http://0.0.0.0:8080
=> Run `rails server -h` for more startup options
Puma starting in single mode...
* Version 3.6.2 (ruby 2.3.0-p0), codename: Sleepy Sunday Serenity
* Min threads: 5, max threads: 5
* Environment: development
* Listening on tcp://0.0.0.0:8080
Use Ctrl-C to stop
Started GET "/" for 144.124.4.228 at 2016-11-24 12:13:51 +0000
Cannot render console from 144.124.4.228! Allowed networks: 127.0.0.1, ::1, 127.0.0.0/127.255.255.255
  ActiveRecord::SchemaMigration Load (1.8ms)  SELECT "schema_migrations".* FROM "schema_migrations"
Processing by HomeController#index as HTML
  Rendering home/index.html.erb within layouts/application
  Rendered home/index.html.erb within layouts/application (2.2ms)
  Rendered sessions/_login.html.erb (1.8ms)
Completed 200 OK in 709ms (Views: 692.0ms | ActiveRecord: 0.0ms)


Started GET "/cable" for 144.124.4.228 at 2016-11-24 12:13:54 +0000
Cannot render console from 144.124.4.228! Allowed networks: 127.0.0.1, ::1, 127.0.0.0/127.255.255.255
Started GET "/cable/" [WebSocket] for 144.124.4.228 at 2016-11-24 12:13:54 +0000
Successfully upgraded to WebSocket (REQUEST_METHOD: GET, HTTP_CONNECTION: Upgrade, HTTP_UPGRADE: websocket)
  User Load (0.4ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = ? LIMIT ?  [["id", 41], ["LIMIT", 1]]
Registered connection (Z2lkOi8vY3NhL1VzZXIvNDE)
  Broadcast Load (2.0ms)  SELECT  "broadcasts".* FROM "broadcasts" ORDER BY "broadcasts"."id" DESC LIMIT ?  [["LIMIT", 20]]
[ActionCable] Broadcasting to FeedsChannel: [#<Broadcast id: 38, content: "Hello From APP!!!\n", user_id: 41, created_at: "2016-11-18 16:24:38", updated_at: "2016-11-18 16:24:38">, #<Broadcast id: 39, content: "Hello from MrPaul's App\n", user_id: 41, created_at: "2016-11-18 18:07:41", updated_at: "2016-11-18 18:07:41">, #<Broadcast id: 40, content: "New app test 2", user_id: 41, created_at: "2016-11-18 18:09:13", updated_at: "2016-11-18 18:09:13">, #<Broadcast id: 41, content: "ALALLALALALALA", user_id: 41, created_at: "2016-11-18 19:13:40", updated_at: "2016-11-18 19:13:40">, #<Broadcast id: 42, content: "LALALA TETS", user_id: 41, created_at: "2016-11-18 19:19:09", updated_at: "2016-11-18 19:19:09">, #<Broadcast id: 43, content: "Tets from app fro feeds", user_id: 41, created_at: "2016-11-18 19:37:38", updated_at: "2016-11-18 19:37:38">, #<Broadcast id: 44, content: "fsfsdf", user_id: 41, created_at: "2016-11-18 19:38:14", updated_at: "2016-11-18 19:38:14">, #<Broadcast id: 45, content: "Test from app tesrers", user_id: 41, created_at: "2016-11-18 19:38:48", updated_at: "2016-11-18 19:38:48">, #<Broadcast id: 46, content: "lalalalal", user_id: 41, created_at: "2016-11-21 17:26:55", updated_at: "2016-11-21 17:26:55">, #<Broadcast id: 47, content: "cdsc", user_id: 41, created_at: "2016-11-21 17:51:25", updated_at: "2016-11-21 17:51:25">, #<Broadcast id: 48, content: "nohonnl", user_id: 41, created_at: "2016-11-21 18:12:22", updated_at: "2016-11-21 18:12:22">, #<Broadcast id: 49, content: "rewrewwrwr", user_id: 41, created_at: "2016-11-22 12:45:16", updated_at: "2016-11-22 12:45:16">, #<Broadcast id: 50, content: "sefewr", user_id: 41, created_at: "2016-11-22 14:45:19", updated_at: "2016-11-22 14:45:19">, #<Broadcast id: 51, content: "fdsfdsfsd", user_id: 41, created_at: "2016-11-22 16:41:04", updated_at: "2016-11-22 16:41:04">, #<Broadcast id: 52, content: "trrretretr", user_id: 41, created_at: "2016-11-22 17:40:20", updated_at: "2016-11-22 17:40:20">, #<Broadcast id: 53, content: "fdsfsdfsd", user_id: 41, created_at: "2016-11-22 17:47:05", updated_at: "2016-11-22 17:47:05">, #<Broadcast id: 54, content: "fdsds", user_id: 41, created_at: "2016-11-22 18:05:17", updated_at: "2016-11-22 18:05:17">, #<Broadcast id: 55, content: "fdsfs", user_id: 41, created_at: "2016-11-22 18:23:44", updated_at: "2016-11-22 18:23:44">, #<Broadcast id: 56, content: "iyuirriry", user_id: 41, created_at: "2016-11-22 18:32:00", updated_at: "2016-11-22 18:32:00">, #<Broadcast id: 57, content: "fdsfsfs", user_id: 41, created_at: "2016-11-23 15:23:08", updated_at: "2016-11-23 15:23:08">]
FeedsChannel is transmitting the subscription confirmation

我查看了控制台并深入挖掘了客户端,发现当我键入“App.feeds.received.data”时,它返回为“[=29=” ]undefined' 我缺少哪些部分才能让它正常工作? 谢谢。

我认为您不应该从订阅的方法进行广播。您只需要:

def subscribed
   stream_from "feed"
end

在页面加载时,您应该只在最初呈现页面时在提要 div 中呈现您想要的所有广播消息,然后如果有任何内容添加到提要,则向所有客户端广播。如果所有客户端都订阅并从 "feeds" 流式传输,则应在每个客户端浏览器中进行更新。

在服务器端,只要您创建了一个新的广播对象(可能在模型或控制器中),只需添加:

ActionCable.server.broadcast "feed", messages: new_broadcast_object

A​​ction Cable 正在发送 JSON,因此您无法通过网络套接字直接发送 ruby 对象并在客户端附加数据 javascript。确保您的消息是一个 html 字符串,或者如果您需要在客户端对其进行操作,请将您的 new_broadcast_object 对象转换为 JSON。