Uncaught SyntaxError: Unexpected token H in JSON at position 0

[brepoelsv]

Uncaught SyntaxError: Unexpected token H in JSON at position 0
at JSON.parse ()
at WebSocket.self._websocket.onmessage (websocket.js:365)
self._websocket.onmessage @ websocket.js:365

The websocket.js is the local autobahn version from the socket.me installation guide.

I want to integrate the onopen function which is working in my setup with the Chat.php example without zeroMQ and React

The Pusher websockets do also work as long as I dont use the onopen function. Then I receive above error message. in the chrome console.
The output of the bin.push-server.php in the terminal is underneath

root@localhost:/home/blobber# php bin/push-server.php
2020-11-16 18:22:22 push-server Started on port 12345
2020-11-16 18:22:27 New connection! (58)
2020-11-16 18:22:27 Hello Sent to (58)

Pusher.php

namespace MyApp;
use Ratchet\ConnectionInterface;
use Ratchet\Wamp\WampServerInterface;

class Pusher implements WampServerInterface {

protected $connections;

public function __construct() {
$this->connections = new \SplObjectStorage;      
}

/**
 * A lookup of all the topics clients have subscribed to
 */
protected $subscribedTopics = array();

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

/**
 * @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['url_symbol'], $this->subscribedTopics)) {
        return;
    }

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

    // re-send the data to all the clients subscribed to that category
    $topic->broadcast($entryData);
}
public function onUnSubscribe(ConnectionInterface $conn, $topic) {
}

public function onOpen(ConnectionInterface $conn) {        
    // START OF 4 LINES NOT WORKING
     $this->connections->attach($conn);
     echo date("Y-m-d H:i:s")." New connection! ({$conn->resourceId})\n";        
     $conn->send("Hello {$conn->resourceId} from server at : ".date("Y-m-d H:i:s"));
     echo date("Y-m-d H:i:s")." Hello Sent to  ({$conn->resourceId})\n"; 
    // END OF 4 LINES NOT WORKING
}
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) {
}

}

in bottom html page

var bstime = document.getElementById("trades_placeholderT1");
bstime.innerHTML = '';
var conn = new ab.Session('wss://ws.cryptoprediction.io',
    function() {
        conn.subscribe('ethusd', function(topic, data) {
            // console.warn('Subscribed succesfull');
            
            bstime.innerHTML = data.price;
            // This is where you would add the new article to the DOM (beyond the scope of this tutorial)
            console.log('New article published to category "' + topic + '" : ' + data.price);
        });
    },
    function() {
        console.warn('WebSocket connection closed');
    },
    {'skipSubprotocolCheck': true}
);

bin/push-server.php

require dirname(__DIR__) . '/vendor/autoload.php';

$loop   = React\EventLoop\Factory::create();
$pusher = new MyApp\Pusher;

// Listen for the web server to make a ZeroMQ push after an ajax request
$context = new React\ZMQ\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:12345', $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
);
echo date("Y-m-d H:i:s")." push-server Started on port 12345 \n";
$loop->run();