nahid / talk

Talk is a real-time users messaging and chatting system for Laravel.
MIT License
1.61k stars 327 forks source link

pusher error "Path not found" #68

Closed packytagliaferro closed 7 years ago

packytagliaferro commented 7 years ago

I get this error from this code:

<script>
    var msgshow = function(data) {
        // write what you want with this data

        console.log(data);
    }
</script>

{!! talk_live(['user'=>["id"=>auth()->user()->id, 'callback'=>['msgshow']]]) !!}

talk.php config

'user' => [
        'model' => 'App\User',
    ],
    'broadcast' => [
        'enable' => true,
        'app_name' => env('APP_NAME', 'Punishment Leage'),
        'pusher' => [
            'app_key' => env('PUSHER_APP_KEY'),
            'app_secret' => env('PUSHER_APP_SECRET'),
            'app_id' => env('PUSHER_APP_ID'),
            'options' => [
              'cluster' => env('PUSHER_APP_CLUSTER'),
              'encrypted' => true
            ],
        ],
    ],

env

PUSHER_APP_ID=XXXXX
PUSHER_APP_KEY=XXXXXXX
PUSHER_APP_SECRET=XXXXXXXX
PUSHER_APP_CLUSTER=us2

I tested with Pushers script so I know the env information is correct.

nahid commented 7 years ago

Please share your complete error meaagse

packytagliaferro commented 7 years ago

Here it is:

pusher.min.js:8 Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":4005,"message":"Path not found"}}}
pusher.min.js:8 Pusher : State changed : connecting -> disconnected
nahid commented 7 years ago

do you using Firefox?

packytagliaferro commented 7 years ago

Nope, I am using Chrome.

Side note, I tried the JS from Pusher's site and it worked so not sure whats wrong.

JS from Pusher:

<script src="https://js.pusher.com/4.0/pusher.min.js"></script>
  <script>

    // Enable pusher logging - don't include this in production
    Pusher.logToConsole = true;

    var pusher = new Pusher('XXXXXXXXXXXXX', {
      cluster: 'us2',
      encrypted: true
    });

    var channel = pusher.subscribe('my-channel');
    channel.bind('my-event', function(data) {
      alert(data.message);
    });
  </script>
packytagliaferro commented 7 years ago

Any news on this? Do I have to uncomment out the boilerplate Pusher stuff in the bootstrap.js file that comes with Laravel?

Here is what Firefox showed:

"talk" account:48:4
"Pusher : State changed : initialized -> connecting" pusher.min.js:8:2593
"Pusher : Connecting : {"transport":"ws","url":"wss://ws.pusherapp.com:443/app/XXXXXXXXXX?protocol=7&client=js&version=3.2.4&flash=false"}" pusher.min.js:8:2593
"You are running Vue in development mode.
Make sure to turn on production mode when deploying for production.
See more tips at https://vuejs.org/guide/deployment.html" app.js:9263:0
The connection to wss://ws.pusherapp.com/app/XXXXXXXXXXXXXXX?protocol=7&client=js&version=3.2.4&flash=false was interrupted while the page was loading. pusher.min.js:8:0
"Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":4001,"message":"Did you forget to specify the cluster when creating the Pusher instance?  App key XXXXXXXXXXXXXXXX does not exist in this cluster."}}}" pusher.min.js:8:10120
"Pusher : Error : {"type":"WebSocketError","error":{"type":"PusherError","data":{"code":4001,"message":"Did you forget to specify the cluster when creating the Pusher instance?  App key XXXXXXXXXXXXX does not exist in this cluster."}}}" pusher.min.js:8:2593
"Pusher : State changed : connecting -> disconnected"
nahid commented 7 years ago

Did you set Cluster properly? Is your App key valid for this cluster?

packytagliaferro commented 7 years ago

@nahid Yep. I set the Cluster and the key as suggested in the talk.php config file:

'user' => [
        'model' => 'App\User',
    ],
    'broadcast' => [
        'enable' => true,
        'app_name' => env('APP_NAME', 'Punishment Leage'),
        'pusher' => [
            'app_key' => env('PUSHER_APP_KEY'),
            'app_secret' => env('PUSHER_APP_SECRET'),
            'app_id' => env('PUSHER_APP_ID'),
            'options' => [
              'cluster' => env('PUSHER_APP_CLUSTER'),
              'encrypted' => true
            ],
        ],
    ],

Then in my ENV file I put the credidtials:

PUSHER_APP_ID=IIIIIIIIIIIII
PUSHER_APP_KEY=KKKKKKKKKKKK
PUSHER_APP_SECRET=SSSSSSSSSSSSSS
PUSHER_APP_CLUSTER=us2

I got these from Pusher.com:

app_id = "IIIIIIIIIIIII"
key = "KKKKKKKKKKKKKKK"
secret = "SSSSSSSSSSSS"
cluster = "us2"

This test code from Pusher worked just fine in the app:

<script src="https://js.pusher.com/4.0/pusher.min.js"></script>

<script>

    Pusher.logToConsole = true;

    var pusher = new Pusher('KKKKKKKKKKKKKKK', {
      cluster: 'us2',
      encrypted: true
    });

    var channel = pusher.subscribe('my-channel');
    channel.bind('my-event', function(data) {
      alert(data.message);
    });
</script>
nahid commented 7 years ago

please view source code from browser and take a screenshot where Talk automatically generate pusher code and send me it.

packytagliaferro commented 7 years ago

@nahid just emailed you. The error looks like its coming from pusherjs.blade.php line 8. You never add the Cluster and get the variable from the config file. When I hardcoded it in there to test it worked.

Also note ( I can create a new issue). If you app name has a space in it (like MY App) you will get another error since a channel name cannot have spaces. You should add a function to replace any spaces in $talk__appName with -

nahid commented 7 years ago

Please update it to v2.2.1

packytagliaferro commented 7 years ago

@nahid Perfect. That update must have come out right after my initial install a month or so ago. All fixed.

shoppingdev-tech commented 3 years ago

what is the solution ? i have same problem @nahid @packytagliaferro