无法理解 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
Action Cable 正在发送 JSON,因此您无法通过网络套接字直接发送 ruby 对象并在客户端附加数据 javascript。确保您的消息是一个 html 字符串,或者如果您需要在客户端对其进行操作,请将您的 new_broadcast_object 对象转换为 JSON。
几天来我一直在研究 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
Action Cable 正在发送 JSON,因此您无法通过网络套接字直接发送 ruby 对象并在客户端附加数据 javascript。确保您的消息是一个 html 字符串,或者如果您需要在客户端对其进行操作,请将您的 new_broadcast_object 对象转换为 JSON。