I built a very simple app using Rails 5 beta 1 and ActionCable to show when users come online and let them send messages to each other.
我使用Rails 5 beta 1和ActionCable构建了一个非常简单的应用程序来显示用户何时在线,并让他们互相发送消息。
Now, I would basically like to take the client-side part of ActionCable, implement it in the context of another app (that does not run on Rails 5) and connect it with the first app to send and receive data (such as the online status of users or messages).
现在,我基本上想利用ActionCable的客户端部分,在另一个应用程序的上下文中实现它(它不在Rails 5上运行),并将它与第一个要发送和接收数据的应用程序连接起来(比如用户或消息的在线状态)。
To send data from that second app, I assume, I can simply make an AJAX POST request. The question is: How do I subscribe from my second app to an open connection of the first app?
要从第二个应用程序发送数据,我假设只需发出AJAX POST请求。问题是:如何从第二个应用订阅到第一个应用的开放连接?
Or even: How do I subscribe to the ActionCable connection of my Rails app from another app via API?
甚至:如何通过API从另一个应用程序订阅我的Rails应用程序的ActionCable连接?
My guess is, I essentially want to include this coffeescript somehow in my second app:
我的猜测是,我本质上想把这个咖啡稿写进我的第二个应用里:
App.appearance = App.cable.subscriptions.create "AppearanceChannel",
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) ->
# ...
2 个解决方案
#1
19
You'll essentially need to include a copy or port of the ActionCable JS code in your other app (https://github.com/rails/rails/tree/master/actioncable/app/assets/javascripts).
实际上,您需要在其他应用程序中包含ActionCable JS代码的副本或端口(https://github.com/rails/rails/rails/tree/master/actioncable/app/assets/ony)。
Update: I recently released an npm package called actioncable-js that provides a direct port of Ruby on Rails 5's ActionCable CofeeScript to standard JS for use outside of Rails: https://github.com/mwalsher/actioncable-js
更新:我最近发布了一个名为ActionCable - JS的npm包,它提供了Ruby on Rails 5的ActionCable CofeeScript到标准JS的直接端口,可以在Rails之外使用:https://github.com/mwalsher/actioncable-js
Because ActionCable is just a layer on top of HTML5 WebSockets, so you can also use raw WebSockets JS code (or any third-party library) to handle the messaging.
因为ActionCable只是HTML5 WebSockets之上的一层,所以你也可以使用原始的WebSockets JS代码(或者任何第三方库)来处理消息。
The ActionCable message protocol is somewhat documented here: https://github.com/NullVoxPopuli/action_cable_client#the-action-cable-protocol. I'll paste below for convenience:
ActionCable消息协议在这里有一定的文档说明:https://github.com/nullvoxpopulli/action_cable_client # action- cableprotocol。为了方便,我将在下面粘贴:
- Connect to the Action Cable URL
- 连接到操作电缆URL
-
After the connection succeeds, send a subscribe message
连接成功后,发送一个订阅消息
- The subscribe message JSON should look like this:
{"command":"subscribe","identifier":"{\"channel\":\"MeshRelayChannel\"}"}
- 订阅消息JSON应该如下:{"command":"subscribe","identifier":"{\"channel\" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \"}
- You should receive a message like this:
{"identifier"=>"{\"channel\":\"MeshRelayChannel\"}", "type"=>"confirm_subscription"}
- 您应该收到这样的消息:{“标识符”=>“{\”通道\”:\“网格通道\”,“类型”=>“确认订阅”}
- The subscribe message JSON should look like this:
-
Once subscribed, you can send messages.
一旦订阅,您可以发送消息。
- Make sure that the action string matches the data-handling method name on your ActionCable server.
- 确保操作字符串与ActionCable服务器上的数据处理方法名匹配。
- Your message JSON should look like this:
{"command":"message","identifier":"{\"channel\":\"MeshRelayChannel\"}","data":"{\"to\":\"user1\",\"message\":\"hello from user2\",\"action\":\"chat\"}"}
- JSON消息应该是这样的:{“命令”:“消息”,“标识符”:“{ \“通道\”:\“MeshRelayChannel \“}”,“数据”:“{ \“\”,\“user1 \”,\“消息\”:\“你好从user2 \”,\“行动\”,\“聊天\”} " }
- Received messages should look about the same
- 收到的消息应该看起来差不多
-
Notes:
注:
- Every message sent to the server has a command and identifier key.
- 发送到服务器的每个消息都有一个命令和标识符密钥。
- The channel value must match the name of the channel class on the ActionCable server.
- 通道值必须与ActionCable服务器上的通道类的名称相匹配。
-
identifier
anddata
are redundantly jsonified. - 标识符和数据是冗余的。
So, for example (in ruby)
例如(在ruby中)
payload = {
command: 'command text',
identifier: { channel: 'MeshRelayChannel' }.to_json,
data: { to: 'user', message: 'hi', action: 'chat' }.to_json
}.to_json
#2
18
While mwalsher's solution was extremely helpful to me, I recently found a pull request on the Rails repository with an official solution to my question.
虽然mwalsher的解决方案对我非常有帮助,但我最近在Rails存储库中找到了一个拉请求,并给出了一个正式的解决方案。
https://github.com/rails/rails/pull/24991
https://github.com/rails/rails/pull/24991
I assume, in the near future this will be added to the main documentation. Here is the link to the official actioncable npm package: https://www.npmjs.com/package/actioncable
我认为,在不久的将来,这将被添加到主要文档中。以下是官方actioncable npm包的链接:https://www.npmjs.com/package/actioncable
You can use it similar to mwalsher's solution with any JS app. Just install the npm package:
你可以像mwalsher的解决方案一样使用任何JS应用。只要安装npm包:
npm install actioncable --save
Here the JS example from the documentation:
这里是文档中的JS示例:
ActionCable = require('actioncable')
var cable = ActionCable.createConsumer('wss://RAILS-API-PATH.com/cable')
cable.subscriptions.create('AppearanceChannel', {
// normal channel code goes here...
});
Edit: The pull request has been merged for a while, now and the description is part of the official Readme - just not yet in the Rails Guides.
编辑:拉取请求已经合并了一段时间,现在描述是正式自述的一部分——只是在Rails指南中还没有。
#1
19
You'll essentially need to include a copy or port of the ActionCable JS code in your other app (https://github.com/rails/rails/tree/master/actioncable/app/assets/javascripts).
实际上,您需要在其他应用程序中包含ActionCable JS代码的副本或端口(https://github.com/rails/rails/rails/tree/master/actioncable/app/assets/ony)。
Update: I recently released an npm package called actioncable-js that provides a direct port of Ruby on Rails 5's ActionCable CofeeScript to standard JS for use outside of Rails: https://github.com/mwalsher/actioncable-js
更新:我最近发布了一个名为ActionCable - JS的npm包,它提供了Ruby on Rails 5的ActionCable CofeeScript到标准JS的直接端口,可以在Rails之外使用:https://github.com/mwalsher/actioncable-js
Because ActionCable is just a layer on top of HTML5 WebSockets, so you can also use raw WebSockets JS code (or any third-party library) to handle the messaging.
因为ActionCable只是HTML5 WebSockets之上的一层,所以你也可以使用原始的WebSockets JS代码(或者任何第三方库)来处理消息。
The ActionCable message protocol is somewhat documented here: https://github.com/NullVoxPopuli/action_cable_client#the-action-cable-protocol. I'll paste below for convenience:
ActionCable消息协议在这里有一定的文档说明:https://github.com/nullvoxpopulli/action_cable_client # action- cableprotocol。为了方便,我将在下面粘贴:
- Connect to the Action Cable URL
- 连接到操作电缆URL
-
After the connection succeeds, send a subscribe message
连接成功后,发送一个订阅消息
- The subscribe message JSON should look like this:
{"command":"subscribe","identifier":"{\"channel\":\"MeshRelayChannel\"}"}
- 订阅消息JSON应该如下:{"command":"subscribe","identifier":"{\"channel\" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \" \"}
- You should receive a message like this:
{"identifier"=>"{\"channel\":\"MeshRelayChannel\"}", "type"=>"confirm_subscription"}
- 您应该收到这样的消息:{“标识符”=>“{\”通道\”:\“网格通道\”,“类型”=>“确认订阅”}
- The subscribe message JSON should look like this:
-
Once subscribed, you can send messages.
一旦订阅,您可以发送消息。
- Make sure that the action string matches the data-handling method name on your ActionCable server.
- 确保操作字符串与ActionCable服务器上的数据处理方法名匹配。
- Your message JSON should look like this:
{"command":"message","identifier":"{\"channel\":\"MeshRelayChannel\"}","data":"{\"to\":\"user1\",\"message\":\"hello from user2\",\"action\":\"chat\"}"}
- JSON消息应该是这样的:{“命令”:“消息”,“标识符”:“{ \“通道\”:\“MeshRelayChannel \“}”,“数据”:“{ \“\”,\“user1 \”,\“消息\”:\“你好从user2 \”,\“行动\”,\“聊天\”} " }
- Received messages should look about the same
- 收到的消息应该看起来差不多
-
Notes:
注:
- Every message sent to the server has a command and identifier key.
- 发送到服务器的每个消息都有一个命令和标识符密钥。
- The channel value must match the name of the channel class on the ActionCable server.
- 通道值必须与ActionCable服务器上的通道类的名称相匹配。
-
identifier
anddata
are redundantly jsonified. - 标识符和数据是冗余的。
So, for example (in ruby)
例如(在ruby中)
payload = {
command: 'command text',
identifier: { channel: 'MeshRelayChannel' }.to_json,
data: { to: 'user', message: 'hi', action: 'chat' }.to_json
}.to_json
#2
18
While mwalsher's solution was extremely helpful to me, I recently found a pull request on the Rails repository with an official solution to my question.
虽然mwalsher的解决方案对我非常有帮助,但我最近在Rails存储库中找到了一个拉请求,并给出了一个正式的解决方案。
https://github.com/rails/rails/pull/24991
https://github.com/rails/rails/pull/24991
I assume, in the near future this will be added to the main documentation. Here is the link to the official actioncable npm package: https://www.npmjs.com/package/actioncable
我认为,在不久的将来,这将被添加到主要文档中。以下是官方actioncable npm包的链接:https://www.npmjs.com/package/actioncable
You can use it similar to mwalsher's solution with any JS app. Just install the npm package:
你可以像mwalsher的解决方案一样使用任何JS应用。只要安装npm包:
npm install actioncable --save
Here the JS example from the documentation:
这里是文档中的JS示例:
ActionCable = require('actioncable')
var cable = ActionCable.createConsumer('wss://RAILS-API-PATH.com/cable')
cable.subscriptions.create('AppearanceChannel', {
// normal channel code goes here...
});
Edit: The pull request has been merged for a while, now and the description is part of the official Readme - just not yet in the Rails Guides.
编辑:拉取请求已经合并了一段时间,现在描述是正式自述的一部分——只是在Rails指南中还没有。