nuxt-socketi-js v1.0.9
nuxt-socketi-js
Socketi.js for Nuxt.js
This is a fork from @nuxtjs/laravel-echo to work with https://github.com/soketi/echo-server
Requirements
If you use the broadcaster pusher
, you need to ensure that you have pusher-js
installed:
yarn add pusher-js # or npm install pusher-js
If you use the broadcaster socket.io
, you need to ensure that you have socket.io-client
installed:
yarn add socket.io-client # or npm install socket.io-client
Setup
- Add
nuxt-socketi-js
dependency to your project
yarn add --dev nuxt-socketi-js # or npm install --save-dev nuxt-socketi-js
- Add
nuxt-socketi-js
to thebuildModules
section ofnuxt.config.js
export default {
buildModules: [
// Simple usage
'nuxt-socketi-js',
// With options
['nuxt-socketi-js', { /* module options */ }]
]
}
:warning: If you are using Nuxt < v2.9 you have to install the module as a dependency
(No --dev
or --save-dev
flags) and use modules
section in nuxt.config.js
instead of buildModules
.
Using top level options
export default {
buildModules: [
'nuxt-socketi-js'
],
socketi: {
/* module options */
}
}
Options
broadcaster
- Type:
String
- Default:
'null'
You can use 'pusher'
, 'socket.io'
or 'null'
.
See https://laravel.com/docs/broadcasting#driver-prerequisites
plugins
- Type:
Array
- Default:
null
If you have plugins that need to access $echo
, you can use echo.plugins
option.
Note: Plugins are pushed in client mode only (
ssr: false
).
nuxt.config.js
export default {
buildModules: [
'nuxt-socketi-js'
],
echo: {
plugins: [ '~/plugins/socketi.js' ]
}
}
plugins/echo.js
export default function ({ $socketi }) {
// Echo is available here
console.log($socketi)
}
authModule
- Type:
Boolean
- Default:
false
Integration with Auth Module.
connectOnLogin
- Type:
Boolean
- Default:
false
Connect the connector on login, if authModule
is set true
.
disconnectOnLogout
- Type:
Boolean
- Default:
false
Disconnect the connector on logout, if authModule
is set true
.
Usage
This module inject $echo
to your project:
<template>
<div>
<h1>Orders</h1>
</div>
</template>
<script>
export default {
mounted() {
this.$socketi.channel('orders')
.listen('OrderShipped', (e) => {
console.log(e.order.name);
});
}
}
</script>
License
Copyright (c) Nuxt Community