Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to debug 'Invalid frame header' Websocket issues with Rails/websocket-rails (standalone)

I'm getting started with websocket-rails, trying to convert an old polling system for notifications (on Ruby 2.1/Rails 4.0) to something a bit more modern with WS. I'm using WebsocketRails in standalone mode, here is my configuration, basically, the default:

WebsocketRails.setup do |config|
   config.standalone = true
end

I have also setup a fresh Redis running on the default port - there seems to be no communication issues here.

On the client side, I have added the websocket-rails's JS and when trying to open an connection and subscribe to a channel, with:

@dispatcher = new WebSocketRails "localhost:3001/websocket"
@channel = @dispatcher.subscribe "notifications"

I see an error in the Chrome console:

WebSocket connection to 'ws://localhost:3001/websocket' failed: Invalid frame header 

In Firefox, the error is different but still an error:

The connection to ws://localhost:3001/websocket was interrupted while the page was loading.

From the websocket server logs, I can see that a connection has been initiated and then dropped, but there are no other logs, even tho log level is "debug"... There are no other errors that I can see and a cursory Google search doesn't bring up anything regarding "invalid frame header", so I'm pretty much stuck.

Any help would be appreciated!

EDIT: I ended up using NodeJS+Faye to get things moving, and it has been working so well that I'm happy to introduce this new moving part in the system. I'm sure the issue was just something temporary based on my specific setup but sometimes, you just have to get things done.

like image 237
Enders Avatar asked Nov 12 '14 06:11

Enders


1 Answers

I think you are looking for the following resources:

From the question thread: debugging websocket in google chrome

Chrome developer tools now have the ability to list WebSocket frames and also inspect the data if the frames are not binary.

Process:

  1. Launch Chrome Developer tools
  2. Load your page and initiate the WebSocket connections
  3. Click the Network Tab.
  4. Select the WebSocket connection from the list on the left (it will have status of "101 Switching Protocols".
  5. Click the Frames sub-tab. Binary frames will show up with a length and time-stamp and indicate whether they are masked. Text frames will show also include the payload content.

Theres also this (somewhat old) blog article from 2012: Inspecting WebSocket Traffic with Chrome Developer Tools

like image 101
Myst Avatar answered Oct 27 '22 13:10

Myst