小编Car*_*505的帖子

Action Cable和AngularJS跨域集成

我目前有一个Rails 5应用程序作为我的后端,我们称之为"核心".我还有另一个Rails 5应用程序充当我的前端,它正在为AngularJS客户端提供服务,我们可以称之为"Front".这是两个完全独立的Rails 5应用程序,具有完全不同的域.

基本上,我正在尝试通过Core集成Action Cable,并让它与Front进行对话.我在这里使用此服务作为Front:https://www.npmjs.com/package/angular-actioncable.至于Core,这只是基本的Action Cable设置.

问题:我在让握手在两个不同的域中工作时遇到了一些麻烦.我已经阅读了我在网上找到的所有内容,遗憾的是没有太多信息.如果您以前这样做过,请帮忙!

注意:我确实运行了Redis服务器,并且我使用单独的端口来模拟开发中的单独域.

核心:

chat_channel.rb

class ChatChannel < ApplicationCable::Channel
  def subscribed
    stream_from 'http://localhost:2000/#/chat'
  end

  def unsubscribed
    stop_all_streams
  end

  def receive(data)
    ActionCable.server.broadcast('http://localhost:2000/#/chat', data)
  end

  def speak
    params.fetch('data').fetch('chat')
  end
end
Run Code Online (Sandbox Code Playgroud)

route.js

mount ActionCable.server => '/cable'  
Run Code Online (Sandbox Code Playgroud)

cable.yml

development:
  adapter: redis
  url: redis://localhost:6379

test:
  adapter: async

production:
  adapter: redis
  url: redis://localhost:6379
Run Code Online (Sandbox Code Playgroud)

配置/ environments.rb

config.action_cable.disable_request_forgery_protection = true
Run Code Online (Sandbox Code Playgroud)

面前:

ChatCtrl.js

app.controller('ChatCtrl', ['$scope', 'ActionCableChannel',
function($scope, ActionCableChannel) {

  $scope.inputText;
  $scope.chatData = [];

  var consumer = new ActionCableChannel("ChatChannel");
  var …
Run Code Online (Sandbox Code Playgroud)

ruby-on-rails cross-domain websocket angularjs actioncable

5
推荐指数
1
解决办法
853
查看次数