Websockets with Rails(Passenger) - Error during WebSocket handshake: Unexpected response code: 400

Hi all,

I am trying to deploy ActionCable and Rails 5 To Production server (DigitalOcean). I have followed all steps mention in the Gorails video here: https://gorails.com/episodes/deploy-actioncable-and-rails-5

But when I checked my site on production, I got this error on the console:

WebSocket connection to 'ws://139.59.175.34/cable' failed: Error during WebSocket handshake: Unexpected response code: 404

These are my settings:

*/etc/nginx/sites-enabled/default *

server {
        listen 80;
        listen [::]:80 ipv6only=on;

        server_name my_server_domain;
        passenger_enabled on;
        rails_env    production;
        root         /home/deploy/my_app_domain/current/public;

        # ActionCabel config (disable this if u r not using it)
        location /cable {
           passenger_app_group_name actioncable_websocket;
           passenger_force_max_concurrent_requests_per_process 0;
        }

        # redirect server error pages to the static page /50x.html
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
}

config/production.rb

#config.action_cable.url = "/cable"
#config.action_cable.allowed_request_origins = ["http://139.59.175.34"]

app/assets/javascripts/cable.js

(function() {
  this.App || (this.App = {});

  App.cable = ActionCable.createConsumer("/cable");

}).call(this);

I have tried to change the ActionCable config on config/production.rb to:

  config.action_cable.url = [/ws:\/\/*/, /wss:\/\/*/]
  config.action_cable.allowed_request_origins = [/http:\/\/*/, /https:\/\/*/]

But still no luck.

I have also looked into the production.log on the server and this is the error that was recorded:

WebSocket error occurred: One or more reserved bits are on: reserved1 = 1, reserved2 = 0, reserved3 = 0