Requesting Help: Laravel Websockets Not Working With SSL Certificate

[Blue-Kachina]

Overview

This is my first time working with websockets.
The project I'm working in is using the Laravel framework, so I chose to give Laravel Websockets (version 1.3.0) a try.

I set up a simple proof-of-concept project using this package, and in so-doing was able to get it up and running successfully. Communication in this proof-of-concept is insecure though (ws://).

Now, I'm trying to integrate the Laravel Websockets package into a production application which is secured with SSL, and in this instance, when I try to establish a connection from the /laravel-websockets dashboard, I am instantly presented with an error in my browser's console ERR_CONNECTION_RESET.

The network tab shows communication is being attempted securely (wss://).
It shows the proper domain name and port as well.
Because of this, I think the problem is server-side, yet I still don't know where the problem is.

I have encountered the same results in my local dev environment (Win 10/IIS/PHP7.4/Self-signed SSL Cert), as well as in a sandbox environment (Win Server 2016/IIS/PHP7.4/Let's Encrypt SSL Cert)

In case it makes any difference, in my local dev environment, I'm using the HOSTS file to redirect traffic from myapp.dev.local to 127.0.0.1

Relevant Parts Of My .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

When reviewing the documentation for the laravel-websockets library, I see that I need to configure the config/websockets.php file to point to my certificate file(s) and that they must be PEM encoded. After doing a quick search online, it looks like .cer, .crt, .pem files will all fit this bill. I have used an MMC snap-in to Export the Certificate in use as Base-64 encoded X.509 (CER), and have been pointing my environment variables to it.

Any suggestions how I can get this to work?

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
});

[simonbuehler]

Same error here, i never got the certificates accepted in the dev environment, on production i used a apache ssl proxying to localhost