WebSocket connection to failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT

Question

Good day guys

I'm building a chat app using ratchet and save data to mysql database. On localhost everything is working well and connection is established.

Now I have loaded the app on live server and login using SSH (Putty), then navigated to php bin/chat-server.php then on the browser console I get this error :

WebSocket connection to 'wss://donorgametes.com:8080/' failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT

This is my url to the app

https://donorgametes.com/MyApp/

My code :

<script>
    var conn = new WebSocket('wss://donorgametes.com:8080');
    conn.onopen = function (e) {
        console.log("Connection established!");

    };

    conn.onmessage = function (e) {
        showMessage(e.data, 'Others');
    };

    document.querySelector('#chat-form').addEventListener('submit', function (e) {
        e.preventDefault();

        var messageElement = document.querySelector('#message');
        var message = messageElement.value;

        var messageData = {
            'userId': '12',
            'content': message
        }
        var messageDataJson = JSON.stringify(messageData);

        conn.send(JSON.stringify(messageDataJson));
        showMessage(message, 'Me');
        messageElement.value = '';
    });

    function showMessage(msg, sender) {
        var messageItem = document.createElement('li');
        var className = 'list-group-item';

        if (messageItem.classList)
            messageItem.classList.add(className);
        else
            messageItem.className += ' ' + className;

        messageItem.innerHTML = '<strong>' + sender + ': </strong>' + msg;
        document.querySelector('#chat-area > ul').appendChild(messageItem);
    }
</script>

Chat server

use Ratchet\Server\IoServer;
use Ratchet\Http\HttpServer;
use Ratchet\WebSocket\WsServer;
use MyApp\Chat;

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

$server = IoServer::factory(
    new HttpServer(
        new WsServer(
            new Chat()
        )
    ),
    8080
);

$server->run();

How can I run this on live server and get a connection? What steps must I follow?

Solution

After checking your app page source i found that you are using localhost for connection on line number: 38

var conn = new WebSocket('wss://localhost:8080');

Which is wrong, you should use your own domain name.

Second thing is after checking port forwarding on you domain i have found that port 8080 is blocked right now. So you should better ask your hosting provider to open port in IPTABLES for incoming connections or if you have root access then try this Article it might help you to allow port forwading.

Comments

[Alex Mayo]

Possible duplicate of WebSocket connection to 'ws://mydomain.com:8084/?peer_id=123' failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT

[leberknecht]

Port 8080 is not open on donorgametes.com, so either your server is not running (is there any output after starting chat-server.php?) or there is a firewall in the way.

[user1]

@leberknecht no there's no output at all... I'm not sure how to check if there's firewall

[user1]

Any one who can help?

[user1]

The problem still the same, was trying to use different port

[David]

ok,I think some important data about your configuration might be missing, but I searched here on SO for Ratchet Websocket log, I'd have a look if the log-file is showing some useful hint perhaps. Furthermore I found this specific answer, perhaps it's useful for you: stackoverflow.com/a/17905105/1019850. Currently it's only guesswork, so you had to add more details, which would be also nice to see a solution here perhaps.

[David]

On point about the port: webserver and app have to use the same port naturally. Above for the webserver you've configured 8080, but probably you checked that after my answer already.

[Touqeer Shafi]

you can check the port status here: yougetsignal.com/tools/open-ports