Laravel Echo et Socket IO transfert d'interrogation 404 ERR_CONNECTION_CLOSED en boucle

Question

Je crée un site Web en utilisant Laravel Echo Server, Socket IO et Redis. Le problème auquel je suis confronté est que tout fonctionne localement mais pas sur mon serveur VPS.

Lorsque l'utilisateur entre dans une vue qui nécessite Socket IO, une boucle 404 apparaîtra https://example.com:6001/socket.io/?EIO=4&transport=polling&t=O0DofMO net ::ERR_CONNECTION_CLOSED

Sur FireFox, je peux voir cette erreur, décrite plus en détail

Je ne sais pas ce qu'il est censé faire, mais je pense que Socket IO essaie de se connecter pour toujours mais n'y parvient pas.

Utilisation de Laravel 6 sur Apache. Voici ma configuration :

apache.conf :

<IfModule mod_ssl.c>
    <VirtualHost *:443>
            ServerName www.example.com
            ServerName example.com
            ServerAlias www.example.com
            ServerAlias example.com

            DocumentRoot /var/www/html/project/public
            <Directory /var/www/html/project/public>
                    AllowOverride All
                    Allow from All
            </Directory>

            ErrorLog ${APACHE_LOG_DIR}/project.error.log
            CustomLog ${APACHE_LOG_DIR}/project.access.log combined

            SSLCertificateFile /etc/letsencrypt/live/example.com/fullchain.pem
            SSLCertificateKeyFile /etc/letsencrypt/live/example.com/privkey.pem
            Include /etc/letsencrypt/options-ssl-apache.conf
    </VirtualHost>
</IfModule>

laravel-echo-server.json :

{
        "authHost": "https://example.com",
        "authEndpoint": "/broadcasting/auth",
        "clients": [],
        "database": "redis",
        "databaseConfig": {
                "redis": {},
                "sqlite": {
                        "databasePath": "/database/laravel-echo-server.sqlite"
                }
        },
        "devMode": true,
        "host": null,
        "port": "6001",
        "protocol": "http",
        "socketio": {},
        "secureOptions": 67108864,
        "sslCertPath": "",
        "sslKeyPath": "",
        "sslCertChainPath": "",
        "sslPassphrase": "",
        "subscribers": {
                "http": true,
                "redis": true
        },
        "apiOriginAllow": {
                "allowCors" : true,
                "allowOrigin" : "https://example.com",
                "allowMethods" : "GET, POST",
                "allowHeaders" : "Origin, Content-Type, X-Auth-Token, X-Requested-With, Accept, Authori$
        }
}

Ce serveur d'écho Laravel passe par le superviseur :

[program:echo-server]
directory=/var/www/html/project
command=laravel-echo-server start
autostart=true
autorestart=true
user=www-data
redirect_stderr=true
stdout_logfile=/var/www/html/project/storage/logs/echoserver.log

J'ai d'abord essayé de savoir si le port 6001 est écouté, il semblerait :

> netstat -tulnp | grep 6001
tcp6       0      0 :::6001                 :::*                    LISTEN      1816/laravel-echo-server

Mon app.js :

require('./bootstrap');
require('jquery');
require('jquery-ui');
require('uikit');

import UIkit from 'uikit';
import Icons from 'uikit/dist/js/uikit-icons';
import $ from 'jquery';
import 'jquery-ui/ui/widgets/sortable';

window.$ = window.jQuery = $;
window.UIkit = UIkit;
window.UIkit.use(Icons);

require('./workspace_list');
require('./workspace_add');

import Echo from 'laravel-echo';

window.Echo = new Echo({
    broadcaster: 'socket.io',
    host: window.location.hostname + ':6001',
});

Et la vue où se trouve le client Socket IO :

<!-- some code ... -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.min.js" integrity="sha512-eVL5Lb9al9FzgR63gDs1MxcDS2wFu3loYAgjIH0+Hg38tCS8Ag62dwKyH+wzDb+QauDpEZjXbMn11blw8cbTJQ==" crossorigin="anonymous"></script>
<script src="{{ mix('js/app.js') }}"></script>

Laravel Echo Server diffuse correctement les événements lors de la soumission d'une opération car je les vois être transmis via tail -f echoserver.log

Mais je ne vois aucun utilisateur se connecter, donc personne ne peut recevoir de données du côté frontend.

Veuillez noter que mon VPS est accessible via un domaine avec des redirections DNS, je ne sais pas si cela posera un problème.

Si quelqu'un a une idée, je serais heureux de comprendre ce qui se passe...

Answer 1

Semble fonctionner maintenant.

J'ai configuré laravel-echo-server.json pour fonctionner via HTTPS.

Cela permet à la diffusion d'événements de fonctionner à nouveau, mais l'authentification des chaînes ne fonctionne pas.

J'ai donc changé la façon dont Socket.IO est importé :

sssccc

à

sssccc

Ces changements ont fonctionné.

Veuillez noter que la suppression du préfixe par défaut de la chaîne aide beaucoup.