nuxt-community / laravel-echo-module

Laravel Echo for Nuxt 2
MIT License
85 stars 32 forks source link

Echo wont connect after page refresh #56

Open acidjazz opened 3 years ago

acidjazz commented 3 years ago

In order to get echo working after a page refresh I have to do this:

this.$echo.options.broadcaster = this.$echo.config.broadcaster
await this.$echo.connect()

it works when the user logs in, but after a refresh it stops and options.broadcaster is null, and connect isnt run again.

i am on version alpha5 with the latest auth-next, my config is:

  echo: {
    broadcaster: 'pusher',
    key: process.env.PUSHER_APP_KEY,
    cluster: process.env.PUSHER_APP_CLUSTER,
    authEndpoint: `${process.env.API_URL}/broadcasting/auth`,
    encrypted: true,
    authModule: true,
    connectOnLogin: true,
    disconnectOnLogout: true,
  },
acidjazz commented 3 years ago

here is a plugin I wrote for this work-around until we have an official fix for anyone that would like it.

import { Echo } from '@nuxtjs/laravel-echo'

export default async function ({ $echo }: { $echo: Echo }) {
  if ($echo.options.broadcaster !== $echo.config.broadcaster) {
    $echo.options.broadcaster = $echo.config.broadcaster
    await $echo.connect()
  }
}
acidjazz commented 3 years ago

@ricardogobbosouza any progress on this?

devzom commented 3 years ago

here is a plugin I wrote for this work-around until we have an official fix for anyone that would like it.

import { Echo } from '@nuxtjs/laravel-echo'

export default async function ({ $echo }: { $echo: Echo }) {
  if ($echo.options.broadcaster !== $echo.config.broadcaster) {
    $echo.options.broadcaster = $echo.config.broadcaster
    await $echo.connect()
  }
}

In which point are You running this script? as a echo plugin or nuxt.config plugins or maybe $auth plugin?

acidjazz commented 3 years ago

@devzom an echo plugin:

  // Doc: https://github.com/nuxt-community/laravel-echo
  echo: {
    broadcaster: 'pusher',
    key: process.env.PUSHER_APP_KEY,
    cluster: process.env.PUSHER_APP_CLUSTER,
    authEndpoint: `${process.env.API_URL}/broadcasting/auth`,
    encrypted: true,
    authModule: true,
    connectOnLogin: true,
    disconnectOnLogout: true,
    plugins: [
      '@/plugins/echo',
    ],
SilvioDoMine commented 2 years ago

This is still happening on ^2.0.0-alpha.5, and this workarround seems to work.

ssgnoe commented 1 year ago

Had the same issue, your workaround did not fully work, so I changed a little bit for me. Imported the plugin as you explained, but the params brought me an error, so I switched like this, now working well. Hope it helps others ;)

export default async function ($nuxt) {
  if ($nuxt.$echo.options.broadcaster !== $nuxt.$echo.config.broadcaster) {
    $nuxt.$echo.options.broadcaster = $nuxt.$echo.config.broadcaster
    await $nuxt.$echo.connect()
  }
}
dloused commented 1 year ago

Doing this defies the purpose of connectOnLogin as a connection will be made on page refresh even if the user is not logged in. Include in your 'if' statement an auth check and you are good to go.

if ($nuxt.$echo.options.broadcaster !== $nuxt.$echo.config.broadcaster && $nuxt.$auth.user)