Xây dựng webSocket với laravel-echo phần 3 - [Presence-channel]

Xây dựng webSocket với laravel-echo phần 3 - [Presence-channel]

phần 1 mình đã giới thiệu về kênh public channel. Sang phần 2 chúng ta đã tìm hiểu qua về kênh Private-channel trong Laravel-Echo. Kênh Private sinh ra để khắc phục nhược điểm của kênh public. Khi 1 user gửi tin nhắn trên kênh public thì toàn bộ client sẽ nhận được. Với kênh private thì chúng ta có thể handle tùy chọn người nhận tùy vào chức năng cửa dự án.
Hôm nay phần 3 này tôi sẽ cho các bạn biết thêm 1 kênh mới. Đó là Presence-channel. Kênh này được xây dựng trên nên tảng kênh private. Tuy nhiên nó có nhiều tính năng mới, phục vụ cho nhiều chức năng sâu hơn mà 1 ứng dụng realtime đòi hỏi.
Ví dụ liệt kê số người đang trong phòng chát, Khi có 1 người join vào phòng, thì sẽ hiện thông báo và ngược lại khi có người thoát khỏi phòng thì hiện thông báo. ....

Start Coding (Nên xem video phía dưới, mấy cái dòng code này mình đưa lên để cho có content thôi.)
Đầu tiên các bạn vào routes/channel.php, khai báo 1 kênh Presence
Broadcast::channel('room-chat', function($user) {
if(Auth::check()) {
return ['id' => $user->id, 'name' => $user->name];
}
});

Sau khi thêm kênh "room-chat" ở trên, chúng ta vào file ExampleComponent.vue viết code.
Echo.join('room-chat')
.here((users) => {
console.log('users', users)
})
.joining((user) => {
console.log('joining: ', user.name);
})
.leaving((user) => {
console.log('leaving: ', user.name);
})
.listen('NewMessage', (data) => {
console.log('data: ' , data)
})
.error((error) => {
console.error(error);
});

Source Code: https://gitlab.com/phongdat/web-socket/-/tree/Presence-channel