Laravel websockets
Dear Team i am using laravel version 8.1.7, i could not figure out the bootstrap file where i need to enabled
import Echo from 'laravel-echo';
window.Pusher = require('pusher-js');
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'mykey',
wsHost: window.location.hostname,
wsPort: 6001,
forceTLS: false,
disableStats: true,
});
kindly guide
import Echo from 'laravel-echo';
window.Pusher = require('pusher-js');
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'mykey',
wsHost: window.location.hostname,
wsPort: 6001,
forceTLS: false,
disableStats: true,
});
kindly guide
Replies (1)
Hi,
To enable the Laravel Echo with Pusher in your Laravel project, you need to follow these steps:
1. Install Pusher and Laravel Echo using NPM:
2. Configure the Laravel Echo by adding the following code in your resources/js/bootstrap.js file:
3. Make sure to replace
Make sure to include the bootstrap.js file in your webpack.mix.js file:
4. You can then use Laravel Echo in your Vue components or JavaScript files as follows:
5. Replace 'channel-name' and 'EventName' with your actual channel and event names, respectively.
Thanks
To enable the Laravel Echo with Pusher in your Laravel project, you need to follow these steps:
1. Install Pusher and Laravel Echo using NPM:
npm install --save pusher-js laravel-echo2. Configure the Laravel Echo by adding the following code in your resources/js/bootstrap.js file:
import Echo from 'laravel-echo';
window.Pusher = require('pusher-js');
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'mykey',
wsHost: window.location.hostname,
wsPort: 6001,
forceTLS: false,
disableStats: true,
});3. Make sure to replace
mykey with your actual Pusher API key.Make sure to include the bootstrap.js file in your webpack.mix.js file:
mix.js('resources/js/bootstrap.js', 'public/js');
You can then use Laravel Echo in your Vue components or JavaScript files as follows:4. You can then use Laravel Echo in your Vue components or JavaScript files as follows:
Echo.channel('channel-name')
.listen('EventName', (data) => {
console.log(data);
});5. Replace 'channel-name' and 'EventName' with your actual channel and event names, respectively.
Thanks
React Dev Vacancy
KeenThemes is looking for a Junior React or Vue developer to build awesome apps.
Apply
