1

For my nuxt app, i need to use pusher for handling websocket.

I use pusher-js, and i created a nuxt plugin to enable pusher throughtout my app.

The problem is that i need to be auth to use pusher. That my plugin :

import Pusher from 'pusher-js'

export default ({ $axios, env, $auth }, inject) => {
  if (!$auth.loggedIn) {
    return
  }
  const pusher = new Pusher(process.env.PUSHER_APP_KEY, {
    cluster: 'eu',
    authEndpoint: `${$axios.defaults.baseURL}/broadcasting/auth`,
    auth: {
      headers: {
        Authorization: $auth.strategy.token.get()
      }
    }
  })
  inject('pusher', pusher)
}

Here is where i register my plugin in the nuxt-config

auth: {
    redirect: {
      login: '/auth/login',
      logout: '/auth/login',
      callback: '/auth/login',
      home: '/'
    },
    strategies: {
      laravelJWT: {
        provider: 'laravel/jwt',
        url: process.env.BASE_BACK_URL + '/platform',
        endpoints: {
          login: { url: '/auth/login', method: 'post' },
          user: { url: '/auth/me' },
          logout: { url: '/auth/logout', method: 'post' },
          refresh: { url: '/auth/refresh' }
        },
        user: {
          property: 'data'
        },
        token: {
          property: 'access_token',
          maxAge: 60 * 60
        },
        refreshToken: {
          maxAge: 20160 * 60
        }
      }
    },
    plugins: [
      { src: 'plugins/pusher.js', ssr: false }
    ]
  },

When I'm logged and I refresh the page it's fine. But when I log in via login page, the pusher object is not instantiated (because I was not logged in) and when I want to go to my chat page, the website has not refreshed (cause spa) and I obvioulsy get an error cause I want to access pusher but it does not exist.

So is there a way to refresh the plugin when i login, or to enable it only when i'm logged ?

Thx :)

B.Samuel
  • 51
  • 1
  • 1
  • 6

0 Answers0