Обзор

Я впервые работаю с websockets. Проект, в котором я работаю, использует платформу Laravel, поэтому я решил попробовать Laravel Websockets (версия 1.3.0).

Я настроил простой проект проверки концепции, используя этот пакет, и при этом смог успешно запустить его и запустить. Однако связь в этом доказательстве концепции небезопасна (ws://).

Теперь я пытаюсь интегрировать пакет Laravel Websockets в рабочее приложение, защищенное с помощью SSL, и в этом случае, когда я пытаюсь установить соединение с /laravel-websockets панели мониторинга, я мгновенно получаю сообщение об ошибке в консоли моего браузера ERR_CONNECTION_RESET .

На вкладке сеть показана попытка безопасного обмена данными (wss://). Он также показывает правильное доменное имя и порт. Из-за этого я думаю, что проблема на стороне сервера, но я все еще не знаю, в чем проблема.

Я столкнулся с теми же результатами в моей локальной среде разработки (Win 10 / IIS / PHP7.4 / Самозаверяющий SSL-сертификат), а также в среде изолированной среды (Win Server 2016 / IIS / PHP7.4 / Let’s Encrypt SSL Cert)

В случае, если это имеет какое-либо значение, в моей локальной среде разработки я использую HOSTS файл для перенаправления трафика с myapp.dev.local на 127.0.0.1

Соответствующие части моего .env

 BROADCAST_DRIVER=pusher
PUSHER_APP_ID=XXX
PUSHER_APP_KEY=XXX
PUSHER_APP_SECRET=IHAVENEVERDONETHISBEFORE
PUSHER_APP_CLUSTER=mt1


LARAVEL_WEBSOCKETS_SSL_LOCAL_CERT="C:/certificate.cer"
#LARAVEL_WEBSOCKETS_SSL_LOCAL_PK="C:/privateKey.key"
#LARAVEL_WEBSOCKETS_SSL_PASSPHRASE=1234
 

Просматривая документацию для библиотеки laravel-websockets, я вижу, что мне нужно настроить config/websockets.php файл так, чтобы он указывал на мои файлы сертификатов, и что они должны быть в PEM-кодировке. После быстрого поиска в Интернете, похоже .cer , , .crt , .pem файлы будут соответствовать этому счету. Я использовал оснастку MMC для экспорта сертификата, используемого в качестве X.509 в кодировке Base-64 (CER), и указывал на него свои переменные среды.

Любые предложения, как я могу заставить это работать?

websockets.php

     /*
     * Define the optional SSL context for your WebSocket connections.
     * You can see all available options at: http://php.net/manual/en/context.ssl.php
     */
    'ssl' => [
        /*
         * Path to local certificate file on filesystem. It must be a PEM encoded file which
         * contains your certificate and private key. It can optionally contain the
         * certificate chain of issuers. The private key also may be contained
         * in a separate file specified by local_pk.
         */
        'local_cert' => env('LARAVEL_WEBSOCKETS_SSL_LOCAL_CERT', null),

        /*
         * Path to local private key file on filesystem in case of separate files for
         * certificate (local_cert) and private key.
         */
        'local_pk' => env('LARAVEL_WEBSOCKETS_SSL_LOCAL_PK', null),

        /*
         * Passphrase for your local_cert file.
         */
        'passphrase' => env('LARAVEL_WEBSOCKETS_SSL_PASSPHRASE', null),

        'allow_self_signed' => true,

        'verify_peer' => false,
    ],
 

broadcasting.php

         'pusher' => [
            'driver' => 'pusher',
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'app_id' => env('PUSHER_APP_ID'),
            'options' => [
                'cluster' => env('PUSHER_APP_CLUSTER'),
                'host' => '127.0.0.1',
                'port' => 6001,
                'scheme' => 'https',
                'curl_options' => [
                    CURLOPT_SSL_VERIFYHOST => 0,
                    CURLOPT_SSL_VERIFYPEER => 0,
                ]
            ],
        ],
 

bootstrap.js

 import Echo from 'laravel-echo'
console.log('Here')

window.Pusher = require('pusher-js');

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: process.env.MIX_PUSHER_APP_KEY,
    cluster: process.env.MIX_PUSHER_APP_CLUSTER,
    forceTLS: true,
    wsHost: window.location.hostname,
    wsPort: 6001,
    wssPort: 6001,
    disableStats: true,
    enabledTransports: ['ws', 'wss'], // <-- only use ws and wss as valid transports
});