Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

Thavo's avatar
Level 2

Laravel WebSockets - Connection Failed

Hello

I'm following this package intructions: https://beyondco.de/docs/laravel-websockets/getting-started/introduction

This is my code:

websockets.php

'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,
        ],
    ],
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'),
                'useTLS' => false,
                'encrypted' => false,
                'host' => '192.168.100.6',
                'port' => 6001,
                'scheme' => 'http',
            ],
        ],
.env
PUSHER_APP_ID=anyId
PUSHER_APP_KEY=anyKey
PUSHER_APP_SECRET=anySecret
PUSHER_APP_CLUSTER=mt1

I start my main server as: php artisan serve --host=192.168.100.6

websocket: php artisan websocket:serve --host=192.168.100.6

When I try to open websocket dashboard /api/websocket I got:

pusher.min.js:8 WebSocket connection to 'ws://192.168.100.6:6001/app/anyKey?protocol=7&client=js&version=4.3.1&flash=false' failed: 

I tried through React Native pusher:

import Pusher from 'pusher-js/react-native';

const pusher = new Pusher('anyKey', {
  wsHost: '192.168.100.6',
  wsPort: 6001,
  forceTLS: false,
  disableStats: false,
  authEndpoint: '/api/websocket/auth',
});

const channel = pusher.subscribe('ChatChannel');

pusher.connection.bind('state_change', function (states) {
  var prevState = states.previous;
  var currState = states.current;
  console.log(prevState, currState);
});

I tried a route inside Laravel:

Route::get('chat', function(){
    broadcast(new WebSocketChatEvent('some data'));
});

This works

Connection failed

I'm developing React Native App, I can't connect through 127.0.0.1 I need to use my local Ip Address

If I use 127.0.0.1 on both server, I can connect dashboard on websockets, however when I use my local IP like 192.168.100.2 I can't connect

What am I doing wrong?

0 likes
3 replies
Istiake5's avatar

Yes, i got it to work. First and foremost thing is to downgrade your pusher from 6.* to 4.*. There is some issue with that. Here is the config inside resources/js/bootstrap.js window.Echo = new Echo({ broadcaster: 'pusher', key: process.env.MIX_PUSHER_APP_KEY, wsHost: window.location.hostname, wsPort: 6002, wssPort: 6002, disableStats: true, enabledTransports: ['ws', 'wss'], });Whenever you make change with bootstrap.js file, make sure to run npm run dev / npm run production . Also add verify_peer=>false in ssl array inside config/websockets.php

Disciple's avatar

Execute in your terminal: sudo lsof -i -P -n . And verify that your 6001 works properly. In my case it doesn't working at all. Instead sail artisan websockets:serve I have to write php artisan websockets:serve.

Please or to participate in this conversation.