title: Laravel websocket cant connect to pusher ERR_CERT_AUTHORITY_INVALID
body: <p>I have a laravel application with websockets. I already setup all the needs for the websocket and pusher config. But whenever I test my broadcast channel I got </p>
  
  <p><code>app.js:58283 WebSocket connection to 'wss://127.0.0.1/app/644a4ac1988060882370?protocol=7&amp;client=js&amp;version=6.0.2&amp;flash=false' failed: Error in connection establishment: net::ERR_CERT_AUTHORITY_INVALID</code></p>
  
  <p>When i do some reload. sometimes i get
  <code>app.js:55791 WebSocket connection to 'wss://127.0.0.1/app/644a4ac1988060882370?protocol=7&amp;client=js&amp;version=6.0.2&amp;flash=false' failed: WebSocket is closed before the connection is established.</code></p>
  
  <p>Here are my configs.</p>
  
  <p>broadcasting.php</p>
  
  <pre><code>   'pusher' =&gt; [
              'driver' =&gt; 'pusher',
              'key' =&gt; env('PUSHER_APP_KEY'),
              'secret' =&gt; env('PUSHER_APP_SECRET'),
              'app_id' =&gt; env('PUSHER_APP_ID'),
              'options' =&gt; [
                  'cluster' =&gt; env('PUSHER_APP_CLUSTER'),
                  'encrypted' =&gt; true,
                  'host' =&gt; '127.0.0.1',
                  'port' =&gt; 6001,
                  'scheme' =&gt; 'http',
              ],
          ],
  </code></pre>
  
  <p>websockets.php</p>
  
  <pre><code>  'apps' =&gt; [
          [
              'id' =&gt; env('PUSHER_APP_ID'),
              'name' =&gt; env('APP_NAME'),
              'key' =&gt; env('PUSHER_APP_KEY'),
              'secret' =&gt; env('PUSHER_APP_SECRET'),
              'path' =&gt; env('PUSHER_APP_PATH'),
              'capacity' =&gt; null,
              'enable_client_messages' =&gt; false,
              'enable_statistics' =&gt; true,
              'verify_peer' =&gt; false,
          ],
      ],
  </code></pre>
  
  <p>bootstrap.js</p>
  
  <pre><code>import Echo from "laravel-echo"
  window.Pusher = require('pusher-js');
  
  window.Echo = new Echo({
      broadcaster: 'pusher',
      key: 'xxxxxxxxxxxxxxx',
      wsHost: window.location.hostname,
      wsPort: 6001,
      disableStats: true,
      // enabledTransports: ['ws', 'wss']
  });
  
  window.Echo.channel('Inventory').listen('InventoryEvent',(e)=&gt;{
      console.log(e)
  })
  </code></pre>
  
  <p>web.php </p>
  
  <pre><code>Route::get('/', function () {
      broadcast(new InventoryEvent('somedata'));
      return view('welcome');
  });
  </code></pre>
  
  <p>InventoryEvent</p>
  
  <pre><code>namespace App\Events;
  
  use Illuminate\Broadcasting\Channel;
  use Illuminate\Broadcasting\InteractsWithSockets;
  use Illuminate\Broadcasting\PresenceChannel;
  use Illuminate\Broadcasting\PrivateChannel;
  use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
  use Illuminate\Foundation\Events\Dispatchable;
  use Illuminate\Queue\SerializesModels;
  
  class InventoryEvent implements ShouldBroadcast
  {
      use Dispatchable, InteractsWithSockets, SerializesModels;
  
      public $somedata;
  
      /**
       * Create a new event instance.
       *
       * @return void
       */
      public function __construct($somedata)
      {
          $this-&gt;somedata = $somedata;
      }
  
      /**
       * Get the channels the event should broadcast on.
       *
       * @return \Illuminate\Broadcasting\Channel|array
       */
      public function broadcastOn()
      {
          return new Channel('Inventory');
      }
  }
  </code></pre>
  
  <p>package.json</p>
  
  <pre><code>    "devDependencies": {
          "axios": "^0.19",
          "bootstrap": "^4.0.0",
          "cross-env": "^7.0",
          "jquery": "^3.2",
          "laravel-mix": "^5.0.1",
          "lodash": "^4.17.13",
          "popper.js": "^1.12",
          "resolve-url-loader": "2.3.1",
          "sass": "^1.20.1",
          "sass-loader": "7.*",
          "vue": "^2.5.17",
          "vue-template-compiler": "^2.6.10"
      },
      "dependencies": {
          "admin-lte": "^3.0.4",
          "fusioncharts": "^3.15.1-sr.1",
          "laravel-echo": "^1.7.0",
          "pusher-js": "^6.0.2",
          "sweetalert2": "^9.10.9",
          "vue-fusioncharts": "^3.0.4",
          "vue-moment": "^4.1.0",
          "vue-router": "^3.1.6",
          "vue-select": "^3.9.5"
      }
  </code></pre>
  
  <p>I already setup the env for my pusher credentials. Do i need to config something in my pusher in order for this to work? I got another project with the same setup but it works but this one is not.</p>