I have two applications (one rails app and one vue app) that need to communicate through ActionCable. This works very well on development, however, it does not in production. Both apps are deployed on Heroku and the rails app is using the RedisCloud
plugin.
Rails App
## production.rbconfig.action_cable.allowed_request_origins = ['https://actioncablevueapp.herokuapp.com']
## cable.ymldevelopment: adapter: redis url: redis://localhost:6379/1 channel_prefix: web_chattest: adapter: testproduction: adapter: redis url: <%= ENV.fetch("REDISCLOUD_URL") { "redis://localhost:6379/1" } %> channel_prefix: web_chat
## chat_channel.rbclass ChatChannel < ApplicationCable::Channel def subscribed customer = Customer.find_by(external_id: params[:id]) stream_for customer endend
## sidekiq processChatChannel.broadcast_to(Customer.find_by(external_id: user_id), body)
Vue App
In the frontend application I'm using a library called actioncable-vue. This is how it is setup
// main.jsVue.use(ActionCableVue, { debug: true, debugLevel: 'error', connectionUrl: `wss://${process.env.VUE_APP_SERVER_URL.replace('https://', '')}/cable`, connectImmediately: true, store})
// App.vueexport default { name: 'App', channels: { ChatChannel: { received(data) { console.log(data) } } }, mounted() { this.$cable.subscribe({ channel: 'ChatChannel', id: 'anexistingcustomerid' }) } ...}
No errors show up in the console, nor in the the logs I get from heroku. Actually, on heroku I do see an actioncable log message that confirms the subscription. However, no data gets pushed through the cable for my vue app to receive.
Can you think of any other bit of configuration I may have missed? The fact that this works very well in development and in production doesn't throw any errors is throwing me off slightly.