How to configure laravel websockets with SSL on nginx?

As I was following through the instructions on the basic usage of laravel websockets adding ssl. I encountered Websocket connection error in my production web app.

WebSocket connection to 'wss://sub.mylaravapp.com:6001/app/58f20f3e6002cc53ba0a?protocol=7&client=js&version=4.4.0&flash=false' failed: WebSocket is closed before the connection is established.

I already did a lot of research on how to fix this and yet most of them does not work. Or simply there isn’t much information about how to configure laravel-websockets in nginx with let’sEncrypt SSL

Here’s my broadcasting.php configurations:

        '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' => 'http',
                'encrypted' => false*/
                'encrypted' => true,
                'useTLS' => true,
                'host' => 'sub.mylaravapp.com',
                'port' => 6001,
                'scheme' => 'https',
                 'curl_options' => [
                    CURLOPT_SSL_VERIFYHOST => 0,
                    CURLOPT_SSL_VERIFYPEER => 0,
                ]
            ],
        ],

Here’s my bootstrap.js configurations:

import Echo from 'laravel-echo'

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

window.Echo = new Echo({
    broadcaster: 'pusher',
    key: '58f20f3e6002cc5nan0a',
    //cluster: 'ap1',
    //encrypted: false,
    wsHost: window.location.hostname,
    wsPort: 6001,
    wssPort: 6001,
    disableStats: true,
    enabledTransports: ['ws', 'wss']
    //cluster: 'ap1'
    //encrypted: true
});

Here’s my Websockets.php configurations:

    'apps' => [
        [
            'id' => env('PUSHER_APP_ID'),
            'name' => env('APP_NAME'),
            'key' => env('PUSHER_APP_KEY'),
            'secret' => env('PUSHER_APP_SECRET'),
            'path' => env('PUSHER_APP_PATH'),
            'capacity' => null,
            'enable_client_messages' => false,
            'enable_statistics' => true,
        ],
    ],


    'statistics' => [
        /*
         * This model will be used to store the statistics of the WebSocketsServer.
         * The only requirement is that the model should extend
         * `WebSocketsStatisticsEntry` provided by this package.
         */
        'model' => \BeyondCode\LaravelWebSockets\Statistics\Models\WebSocketsStatisticsEntry::class,

        /*
         * Here you can specify the interval in seconds at which statistics should be logged.
         */
        'interval_in_seconds' => 60,

        /*
         * When the clean-command is executed, all recorded statistics older than
         * the number of days specified here will be deleted.
         */
        'delete_statistics_older_than_days' => 60,

        /*
         * Use an DNS resolver to make the requests to the statistics logger
         * default is to resolve everything to 127.0.0.1.
         */
        'perform_dns_lookup' => true,
    ],

    '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' => null,
        'local_cert' => '/var/www/sockettest/fullchain.pem',

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

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

The error in the console log after quite some time throws this error:

WebSocket connection to 'wss://sub.mylaravapp.com:6001/app/58f20f3e6002cc53ba0a?protocol=7&client=js&version=4.4.0&flash=false' failed: Error in connection establishment: net::ERR_CONNECTION_TIMED_OUT

If anyone have overcome this. Please let me see your example. Hoping anyone could help.

Thanks!