Configuration

Detailed description of available module options.

Default configuration

By default, the module uses the following configuration values that you can adjust:

nuxt.config.ts
export default defineNuxtConfig({
  modules: ['nuxt-laravel-echo'],

  echo: {
    broadcaster: 'reverb', // available: reverb, pusher
    host: 'localhost',
    port: 8080,
    scheme: 'https', // available: http, https
    transports: ['ws', 'wss'],
    authentication: {
      baseUrl: 'http://localhost:80',
      authEndpoint: '/broadcasting/auth',
      csrfEndpoint: '/sanctum/csrf-cookie',
      csrfCookie: 'XSRF-TOKEN',
      csrfHeader: 'X-XSRF-TOKEN',
    },
    logLevel: 3,
    properties: undefined,
  },
});

If you don't specify any value in your nuxt.config.ts, then the default config will be used on plugin initialization.

Overrides

Module configuration is exposed to runtimeConfig property of your Nuxt app, so you can override either in echo module config or runtimeConfig.public.echo property.

export default defineNuxtConfig({
  modules: ['nuxt-laravel-echo'],
  
  echo: {
    key: 'MY_APP_KEY',
  },

  runtimeConfig: {
    public: {
      echo: {
        logLevel: 3,
      },
    },
  },
});

Environment variables

It is possible to override options via environment variables too. It might be useful when you want to use .env file to provide key for the broadcast backend.

And here is what it will look like in .env file:

.env
NUXT_PUBLIC_ECHO_KEY='REPLACE_ME'

Available options

For any additional configurations, you can adjust the next list of available parameters:

ParameterDescriptionDefault value

key

The Laravel Broadcasting app key for a secure connection.

undefined

broadcaster

The Laravel broadcaster type to use. Use reverb or pusher.

reverb

host

The host to connect to WebSocket.

localhost

port

The port to connect to WebSocket.

8080

scheme

The scheme to use for the connection. Use http or https.

https

cluster

The application cluster to connect to.

undefined

transports

The transports to enable for the connection.

['ws', 'wss']

authentication

Authentication options for Private and Presence channels.

object

authentication.baseUrl

The base URL of Laravel application.

authentication.authEndpoint

The endpoint used for channels authentication.

/broadcasting/auth

authentication.csrfEndpoint

The endpoint used for CSRF token retrieval.

/sanctum/csrf-cookie

authentication.csrfCookie

The name of the CSRF cookie.

XSRF-TOKEN

authentication.csrfHeader

The name of the CSRF header.

X-XSRF-TOKEN

logLevel

The log level to use for the logger.

3

properties

Additional properties to extend the Echo instance options. See Additional properties section.

undefined

Additional properties

When you are using the Pusher backend, you may need to assign additional properties to your Echo instance object such as:

  • enableStats

  • activityTimeout

  • etc

For these, you can override echo.properties parameter to pass all the details that are not included in the default config:

nuxt.config.ts
export default defineNuxtConfig({
  modules: ['nuxt-laravel-echo'],

  echo: {
    key: 'REPLACE_ME',
    properties: {
      customField: 'customValue',
    },
  },
})

Last updated