Error during web socket handshake; websocket connection failed, using autobahn.js

Question

I am trying to create a websocket server using Ratchet, React and Autobahn. When trying to connect I get this error in console

autobahn.min.js:196 WebSocket connection to 'ws://localhost:8090/' failed: Error during WebSocket handshake: Unexpected response code: 426

During some digging in Google I found out that Ratchet supports only WAMP1, but that information was 2014. Is this still relevant?

This is the JS

   var connection = new autobahn.Connection({
    transports: [{
      type: 'websocket',
      port: 8090,
      host: 'localhost',
      url: 'ws://localhost:8090'
    }],
    realm: 'realm1'
  });
  connection.open();

This is the WebsocketController class

<?php

namespace App\Http\Controllers;
use Ratchet\MessageComponentInterface;
use Ratchet\ConnectionInterface;
use Ratchet\Wamp\WampServerInterface;

class WebSocketController extends Controller implements WampServerInterface{
    private $connections = [];
    protected $subscribedTopics = array();

    public function onSubscribe(ConnectionInterface $conn, $topic) {
        $this->subscribedTopics[$topic->getId()] = $topic;
    }
    public function onUnSubscribe(ConnectionInterface $conn, $topic) {
    }
    public function onOpen(ConnectionInterface $conn) {
        $this->connections->attach($conn);

        echo "New connection! ({$conn->resourceId})\n";
    }
    public function onClose(ConnectionInterface $conn) {
    }
    public function onCall(ConnectionInterface $conn, $id, $topic, array $params) {
        // In this application if clients send data it's because the user hacked around in console
        $conn->callError($id, $topic, 'You are not allowed to make calls')->close();
    }
    public function onPublish(ConnectionInterface $conn, $topic, $event, array $exclude, array $eligible) {
        // In this application if clients send data it's because the user hacked around in console
        $conn->close();
    }
    public function onError(ConnectionInterface $conn, \Exception $e) {
      echo "New error!".$e;
    }

        /**
         * @param string JSON'ified string we'll receive from ZeroMQ
         */
        public function onBlogEntry($entry) {
            $entryData = json_decode($entry, true);

            // If the lookup topic object isn't set there is no one to publish to
            if (!array_key_exists($entryData['category'], $this->subscribedTopics)) {
                return;
            }

            $topic = $this->subscribedTopics[$entryData['category']];

            // re-send the data to all the clients subscribed to that category
            $topic->broadcast($entryData);
        }
}

This is the server:

$loop   = Factory::create();
$pusher = new WebsocketController;

// Listen for the web server to make a ZeroMQ push after an ajax request
$context = new Context($loop);
$pull = $context->getSocket(\ZMQ::SOCKET_PULL);
$pull->bind('tcp://127.0.0.1:5555'); // Binding to 127.0.0.1 means the only client that can connect is itself
$pull->on('message', array($pusher, 'onBlogEntry'));

// Set up our WebSocket server for clients wanting real-time updates
$webSock = new \React\Socket\Server('0.0.0.0:8090', $loop); // Binding to 0.0.0.0 means remotes can connect
$webServer = new \Ratchet\Server\IoServer(
    new \Ratchet\Http\HttpServer(
        new \Ratchet\WebSocket\WsServer(
            new \Ratchet\Wamp\WampServer(
                $pusher
            )
        )
    ),
    $webSock
);

$loop->run();

Headers

Request URL:ws://localhost:8090/
Request Method:GET
Status Code:426 No Sec-WebSocket-Protocols requested supported
Response Headers
view source
Connection:Upgrade
Sec-WebSocket-Protocol:0
Sec-WebSocket-Version:13
Transfer-Encoding:chunked
Upgrade:websocket
X-Powered-By:Ratchet/0.4
Request Headers
view source
Accept-Encoding:gzip, deflate, br
Accept-Language:en-US,en;q=0.9,et;q=0.8
Cache-Control:no-cache
Connection:Upgrade
Host:localhost:8090
Origin:http://ermp.ee:8000
Pragma:no-cache
Sec-WebSocket-Extensions:permessage-deflate; client_max_window_bits
Sec-WebSocket-Key:GbJ7qf3lzKDE2hmh3mxJpQ==
Sec-WebSocket-Protocol:wamp.2.json, wamp.2.msgpack
Sec-WebSocket-Version:13
Upgrade:websocket
User-Agent:Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/62.0.3202.94 Safari/537.36

What am I doing wrong here?

Answer 1

I switched from Ratchet to ThruwayPHP and it started working immediately if somebody else has the same issue.