Uncaught exception: Autobahn not connected

[navalex]

I'm trying to create a chat with symfony 3 and GosWebSocketBundle. This bundle use Autobahn and Ratchet to use WebSocket. My server actually work except when i stop it/restart it, the client reconnect successfully, but on publish, i got Uncaught exception: Autobahn not connected

It only append when the server is on when we loading the page, then restart it and let autobahn reconnect by it own.

GosWebSocket Configuration:

    gos_web_socket:
        server:
            port: 8080
            host: 127.0.0.1
            router:
                resources:
                    - '@CoreBundle/Resources/config/pubsub/routing.yml'
        client:
            firewall: main
            session_handler: session.handler.pdo

ChatTopic services and routes:

    services:
        core.topic_sample_service:
            class: CoreBundle\Topic\ChatTopic
            arguments: [ "@gos_web_socket.websocket.client_manipulator"]
            tags:
                - { name: gos_web_socket.topic }

    chat_topic:
        channel: chat/channel
        handler:
            callback: 'chat.topic'

ChatTopic.php

    <?php
    
    namespace CoreBundle\Topic;
    
    use Gos\Bundle\WebSocketBundle\Topic\TopicInterface;
    use Gos\Bundle\WebSocketBundle\Client\ClientManipulatorInterface;
    use Ratchet\ConnectionInterface;
    use Ratchet\Wamp\Topic;
    use Gos\Bundle\WebSocketBundle\Router\WampRequest;
    
    class ChatTopic implements TopicInterface
    {
    	protected $clientManipulator;
    
    	/**
    	 * @param ClientManipulatorInterface $clientManipulator
    	 */
    	public function __construct(ClientManipulatorInterface $clientManipulator)
    	{
    		$this->clientManipulator = $clientManipulator;
    	}
    
    	/**
    	 * This will receive any Subscription requests for this topic.
    	 *
    	 * @param ConnectionInterface $connection
    	 * @param Topic $topic
    	 * @param WampRequest $request
    	 * @return void
    	 */
    	public function onSubscribe(ConnectionInterface $connection, Topic $topic, WampRequest $request)
    	{
    		$user = $this->clientManipulator->getClient($connection);
    		//this will broadcast the message to ALL subscribers of this topic.
    		$topic->broadcast(['msg' => $user . " has joined " . $topic->getId()]);
    	}
    
    	/**
    	 * This will receive any UnSubscription requests for this topic.
    	 *
    	 * @param ConnectionInterface $connection
    	 * @param Topic $topic
    	 * @param WampRequest $request
    	 * @return void
    	 */
    	public function onUnSubscribe(ConnectionInterface $connection, Topic $topic, WampRequest $request)
    	{
    		//this will broadcast the message to ALL subscribers of this topic.
    		$topic->broadcast(['type' => 'call', 'msg' => $connection->resourceId . " has left " . $topic->getId()]);
    	}
    
    
    	/**
    	 * This will receive any Publish requests for this topic.
    	 *
    	 * @param ConnectionInterface $connection
    	 * @param Topic $topic
    	 * @param WampRequest $request
    	 * @param $event
    	 * @param array $exclude
    	 * @param array $eligible
    	 * @return mixed|void
    	 */
    	public function onPublish(ConnectionInterface $connection, Topic $topic, WampRequest $request, $event, array $exclude, array $eligible)
    	{
    		/*
    			$topic->getId() will contain the FULL requested uri, so you can proceed based on that
    
    			if ($topic->getId() === 'acme/channel/shout')
    				//shout something to all subs.
    		*/
    		
    		$topic->broadcast([
    			'type' => 'msg',
    			'msg' => $event,
    		]);
    	}
    
    	/**
    	 * Like RPC is will use to prefix the channel
    	 * @return string
    	 */
    	public function getName()
    	{
    		return 'chat.topic';
    	}
    }

chatbox.html.twig

    <div class="panel panel-primary panel-chat" id="navalex-chatbox" data-turbolinks-permanent>
        <div class="panel-heading" id="accordion" data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
            <h3 class="panel-title">Chat <span class="pull-right label"></span></h3>
        </div>
        <div class="panel-collapse collapse" id="collapseOne">
            <div class="panel-body">
                <ul class="chat">
                </ul>
            </div>
            <div class="panel-footer">
                <div class="input-group">
                    <input id="btn-input" type="text" class="form-control input-sm" placeholder="Type your message here..." />
                    <span class="input-group-btn">
                                <button class="btn btn-warning btn-sm" id="btn-chat">
                                    <i class="fa fa-send-o"></i></button>
                            </span>
                </div>
            </div>
            <div class="panel-logout">
                <p>Oups, il semblerait que vous n'êtes pas connecté au chat</p>
                <button class="btn btn-primary" data-loading-text="Loading...">Connexion</button>
            </div>
        </div>
    </div>
    {{ include('@Core/Core/chat/new_msg_sample.html.twig') }}
    <ul class="chat-call-sample" style="display: none;">
        <li class="left clearfix">
                <i class="text-muted" id="chat-msg-text"></i>
        </li>
    </ul>
    {{ ws_client() }}
    
    <script type="text/javascript">
        var _WS_URI = "ws://{{ gos_web_socket_server_host }}:{{ gos_web_socket_server_port }}";
        var websocket = WS.connect(_WS_URI);
        var chatbox = $('#navalex-chatbox');
        var chat_msg = chatbox.find("#btn-input");
        var chat_btn = chatbox.find("#btn-chat");
        var chat_list = chatbox.find(".chat");
        var label = $('#navalex-chatbox > .panel-heading > .panel-title > span');
        var logout = $('#navalex-chatbox .panel-logout');
    
        logout.find(".btn").click(function (e) {
            $(this).button('loading');
            websocket.connect(_WS_URI);
        });
    
        websocket.on("socket/connect", function(session) {
            session.subscribe("chat/channel", function(uri, payload) {
                var html;
                if (payload.type == 'msg') {
                    html = $(".chat-sample").find("li").clone(true);
                    html.find("#chat-msg-text").text(payload.msg);
                }
                else {
                    html = $(".chat-call-sample").find("li").clone(true);
                    html.find("#chat-msg-text").text(payload.msg);
                }
                chat_list.append(html);
            });
    
            chat_btn.click(function (e) {
                session.publish("chat/channel", chat_msg.val());
            });
    
            label.removeClass("label-danger");
            label.addClass("label-success");
            label.text("Online");
            logout.css('display', 'none');
            console.log("[NavaChat] Connected");
        });
    
        websocket.on("socket/disconnect", function(error) {
            label.removeClass("label-success");
            label.addClass("label-danger");
            label.text("Offline");
            logout.find(".btn").button('reset');
            logout.css('display', 'block');
            console.log("[NavaChat] Disconnected");
            console.log(error);
        });
    </script>