how to setup websocket with pusher and laravel echo on deployment

Hello @jldev, and welcome to Fly.io!

Can you share more details about your project? What are the packages you’re using that’re affected by the error you’ve shared? Are you using Pusher for broadcasting from Laravel, and Laravel Echo for the frontend client?

Aside from that, since you’re currently getting two errors, let’s tackle each one separately.

1. Uncaught You must pass your app key when you instantiate Pusher.
To debug this, we first check whether the variable name used to set the app key is found in the Fly Machine running your app:

  1. How are you passing the app key to pusher? What is the env variable you’re using to pass app key?
  2. Next, is the env variable you’re using indeed set in the Fly Machine running your Laravel app? To confirm, ssh into your Machine by running:
    fly ssh console
    
    Then once connected to a machine, you can check if your env variable is in the Fly Machine by checking with:
    printenv
    

Also! There’s another community post that you might want to check out regarding this, please see this.. The solution provided might help out regarding setting secret env variables

2. supportLaravelEcho.js:16 Laravel Echo cannot be found
This error seems to be a configuration error in declaring Laravel Echo’s scripts. Are you perhaps using Livewire in your Laravel project? There are similar errors reported in different forums stackoverflow, laracast, which is caused by how scripts should be declared when Livewire is configured in a Laravel app.

Consider the following solutions:

  1. Placing your declaration of Laravel echo above Livewire scripts or Alpine as answers have suggested. ( Answered by user khalilmajdalawi)
  2. Placing declaration of Laravel echo initialization within app.js instead of bootstrap.js, as it can be loaded last. ( Answer by user ItsClassified )