Rails 6中Action Cable无法发起WebSocket连接问题求助

问题描述 #

在Rails 6开发环境中测试Action Cable的WebSocket连接，执行rails g channel chat生成chat频道后，访问首页（http://<IP-Address>:3000），浏览器控制台未出现预期的"connected"日志，WebSocket连接未发起且无任何错误提示。相关文件内容如下：

相关文件内容

app/javascript/channels/chat_channel.js

import consumer from "./consumer"

consumer.subscriptions.create("ChatChannel", {
  connected() {
      console.log("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) {
    // Called when there's incoming data on the websocket for this channel
  }
});

app/channels/chat_channel.rb

class ChatChannel < ApplicationCable::Channel
  def subscribed
     stream_from "chat_channel"
  end

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

config/routes.rb

Rails.application.routes.draw do
  get 'pages/index'
  root 'pages#index'
  mount ActionCable.server => '/cable'
end

config/cable.yml

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

test:
  adapter: test

production:
  adapter: redis
  url: <%= ENV.fetch("REDIS_URL") { "redis://localhost:6379/1" } %>
  channel_prefix: testapp_production

app/controllers/pages_controller.rb

class PagesController < ApplicationController
  def index
  end
end

排查与解决步骤 #

1. 确认channels目录已被Webpack加载 #

Rails 6依赖Webpacker管理前端资源，需确保app/javascript/channels下的文件被自动引入。检查app/javascript/packs/application.js中是否包含：

import "channels"

若缺失，添加后重启Webpack Dev Server和Rails服务器。

2. 验证Redis服务状态 #

你的Action Cable配置使用Redis适配器，必须保证本地Redis服务正常运行。执行命令检查：

redis-cli ping

返回PONG则正常，否则启动Redis服务（如macOS用brew services start redis，Linux用systemctl start redis-server）。

3. 检查Action Cable连接路径一致性 #

确认app/javascript/channels/consumer.js的连接配置与routes匹配，默认配置如下即可：

import { createConsumer } from "@rails/actioncable"

export default createConsumer()

该配置会自动使用/cable路径，与你routes中的mount ActionCable.server => '/cable'一致。

4. 排除浏览器拦截因素 #

部分浏览器插件（如广告拦截器）可能阻止WebSocket连接，尝试关闭插件或使用无痕模式访问页面，查看连接是否恢复。

5. 查看Rails服务器日志 #

启动Rails服务器时，观察终端日志是否有Action Cable启动信息或连接请求记录。若Redis连接失败，日志会给出明确错误提示。

6. 手动编译前端资源 #

执行命令手动编译Webpack资源，确保channels代码被正确打包：

rails webpacker:compile

完成后重启服务器。

内容的提问来源于stack exchange，提问作者PoojaS