https://github.com/muath-ye/laravel-websockets-without-npm
Instruction how to install laravel echo and pusher without vuejs or even npm
https://github.com/muath-ye/laravel-websockets-without-npm
Last synced: about 1 month ago
JSON representation
Instruction how to install laravel echo and pusher without vuejs or even npm
- Host: GitHub
- URL: https://github.com/muath-ye/laravel-websockets-without-npm
- Owner: muath-ye
- Created: 2021-09-20T10:09:40.000Z (over 3 years ago)
- Default Branch: father
- Last Pushed: 2021-09-20T10:10:08.000Z (over 3 years ago)
- Last Synced: 2025-04-19T14:57:26.560Z (about 2 months ago)
- Language: JavaScript
- Size: 31.3 KB
- Stars: 6
- Watchers: 1
- Forks: 2
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
## This 2 .js files are used to listen from server broadcasting with laravel-websockets, so that you don't need the use of Vue.js in your laravel app
- Follow all installation and configuration process of **laravel-websockets** and instead of using Vue.js component, just add this line where you want to listen for changes :
```javascript
window.Laravel = <?php echo json_encode([
'csrfToken' => csrf_token(),
]); ?>;
var module = { }; /* <-----THIS LINE */
import Echo from '{{asset('js/echo.js')}}'
import {Pusher} from '{{asset('js/pusher.js')}}'
window.Pusher = Pusher
window.Echo = new Echo({
broadcaster: 'pusher',
key: 'your-key',
wsHost: window.location.hostname,
wsPort: 6001,
forceTLS: false,
disableStats: true,
});
window.Echo.channel('your-channel')
.listen('your-event-class', (e) => {
console.log(e)
})
console.log("websokets in use")
```
## To generate them follow this instructions
1. Install laravel-echo and pusher with npm
2. Go to ```your-project-folder/node_modules/laravel-echo/dist``` and copy ```echo.js``` to ```your-project-folder/public/js```
3. Go to ```your-project-folder/node_modules/pusher-js/dist/worker``` and copy ```pusher.worker.js```, rename it to ```pusher.js``` then copy to ```your-project-folder/public/js```
4. To the new ```pusher.js``` renamed add "export" before the "var Pusher" in the first line of code like so:
> export var Pusher =
Thats it