I'm currently facing an issue with my Vue app. I've set up the connection to Pusher and laravel echo on the backend, but the frontend seems to be malfunctioning. Below is a snippet of my app.js file:
import Echo from 'laravel-echo';
window.Pusher = require('pusher-js');
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'mykey',
wsHost: '127.0.0.1',
wsPort: 6001,
cluster: process.env.MIX_PUSHER_APP_CLUSTER,
forceTLS: false,
disableStats: true,
});
import './src/main.js'
The issue lies in listening to events, even though other functionalities are working fine.
<template>
<div id="demo-basic-card">
...
...
// The rest of your code goes here
...
...
</template>
<script>
// Your script section continues here
</script>
All configurations seem correct, as everything functions except for real-time data capturing. Upon running 'php artisan websockets:serve', console returns:
Connection id 442760083.70152140 sending message {"event":"log-message"...}
When checking all pusher events via console.log, the error returned says:
Uncaught TypeError: Cannot read property 'apply' of undefined...
This shows up in various parts of the code, hinting at a possible undefined property causing issues.
If you have any insights or suggestions on what might be causing this problem, feel free to share. Thank you!