I use laravel-echo
for working with pusherjs
in Nuxtjs.
nuxt.config.js section for pusherjs configuration:
buildModules: [
[
'@nuxtjs/laravel-echo', {
broadcaster: 'pusher',
key: 'my-key-here',
cluster: 'eu',
forceTLS: true
}
]
],
package.json
"vue": "^2.6.12",
"nuxt": "^2.14.3",
"pusher-js": "^7.0.0",
"@nuxtjs/laravel-echo": "^1.1.0",
pages/test.vue
<script>
export default {
mounted() {
this.$echo.channel('ch').listen("ev", (res) => {
console.log(res);
});
},
};
</script>
I manually send Event via Pusherjs's Debug Console
but nothing happens in chrome's console.
I'm sure the key and my app is connected to pusherjs correctly; because when I refresh the page, the logs appear in pusherjs's debug console:
So why are the events not received in front end?
It seems the problem was because of v1.1.0
of @nuxtjs/laravel-echo
.
I used:
this.$echo.channel("ch").on("ev", (res) => {
console.log(res);
});
instead of:
this.$echo.channel('ch').listen("ev", (res) => {
console.log(res);
});
And the problem solved! (just replace on
with listen
)
Reference:
https://github.com/nuxt-community/laravel-echo/issues/17#issuecomment-637520496
I have followings:
"nuxt": "^2.14.3",
"pusher-js": "^7.0.0",
"@nuxtjs/laravel-echo": "^1.1.0",
And I've to use:
this.$echo.channel("channel").on("event", (res) => {
console.log(res);
});
Although its document says to use:
this.$echo.channel("channel").listen("event", (res) => {
console.log(res);
});
Means I've to chain "on" method instead of "listen". Hope, this will be helpful!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.