Я впервые создаю веб-приложение для чатов с помощью Pusher. Я много читал в документации Пушера, чтобы узнать, как это работает. Мой вопрос скорее о механизме, а не о коде.
Так что я хочу сделать, когда пользователь подключается и присоединяется к presence-channel
который позволяет мне показывать, кто в сети. Я хочу показать знак статуса (зеленый = онлайн, желтый = прочь) для пользователя (например, Skype), и все зарегистрированные пользователи могут видеть изменение между статусом в реальном времени.
Я видел этот вопрос, и, если я понимаю, каждый пользователь должен присоединиться к частному каналу, чтобы лучше управлять своим клиентским событием. Итак, как я могу управлять изменением состояния события для private-channel
и показывать его в канале presence-channel
или как я могу сделать связь между двумя каналами?
Для создания статуса пользователя вам не нужен отдельный канал.
Лучший способ достичь этого сейчас – обнаружить статус пользователя, используя что-то вроде idle.js, а затем инициировать событие на канале присутствия (возможно, client-status-updated
) с информацией о статусе пользователя (например, {"user_id":SOME_ID, "status":"away"}
).
Примечание: для клиентских событий client-
префикс требуется для имени события
Вы можете сделать это с помощью клиентских событий, и это можно сделать на существующих существующих каналах присутствия. Однако вы должны знать, что при использовании клиентских событий любой аутентифицированный пользователь может потенциально инициировать событие состояния и предположить, что он предназначен для другого пользователя. Таким образом, было бы безопаснее делать это с помощью сервера, который может установить даже тот, который исходит от пользователя, который устанавливает статус.
Тем не менее, я действительно не вижу преимущества «взлома», чтобы установить статус другого пользователя.
Ниже приведен пример использования канала присутствия и событий клиента.
<script src="libs/idle.js"></script> <script src="//js.pusher.com/2.2/pusher.min.js"></script> <script> var pusher = new Pusher(APP_KEY); var presence = pusher.subscribe('presence-online'); // Basic online/offline presence.bind('pusher:subscription_succeeded', function(members) { members.each(addUser); }); presence.bind('pusher:member_added', addUser); presence.bind('pusher:member_removed' removeUser); function addUser(member) { // Online - add to UI } function removeUser(member) { // Offline - remove from UI // Consider doing this in a setTimeout // in case the user comes back online again } // User state var idle = new Idle({ onHidden: function() { sendUserStatus('hidden'); }, onVisible: function() { sendUserStatus('visible'); }, onAway: function() { sendUserStatus('away'); }, onAwayBack: function() { sendUserStatus('hidden'); }, awayTimeout: 30000 //away with 30 seconds of inactivity }).start(); function sendUserStatus(status) { var userStatusUpdate = { "user_id": presence.members.me.id, // current user unique ID "status": status }; presence.trigger('client-status-updated', userStatusUpdate); } presence.bind('client-status-updated', function(update) { var userId = update.user_id; var status = user.status; // Update UI to reflect user status }); </script>