Показать статус входа в систему подключающегося пользователя с помощью Websocket и Pusher

Я создаю веб-приложение для чата, используя Pusher в первый раз. Я много читал в документации Pusher, чтобы узнать, как он работает. Мой вопрос больше о механизме, а не о коде.

Итак, что я хочу сделать, когда пользователь подключается и присоединяется к presence-channel, что позволяет мне отображать, кто находится в сети. Я хочу отображать знак состояния (зеленый = в сети, желтый = нет) для пользователя (например, Skype), и все зарегистрированные пользователи могут видеть изменение статуса в режиме реального времени.

Я видел этот вопрос, и, насколько я понимаю, каждый пользователь должен присоединиться к закрытому -channel, чтобы лучше управлять своим клиентским событием. Итак, как я могу управлять событием изменения состояния для private-channel и отображать его в presence-channel или как я могу установить связь между двумя каналами?


person David Edgar    schedule 18.03.2015    source источник


Ответы (1)


Вам не нужен отдельный канал для создания пользовательского статуса.

Лучший способ добиться этого прямо сейчас — определить статус пользователя с помощью чего-то вроде 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>
person leggetter    schedule 19.03.2015
comment
Спасибо, что поделились леггетером. Я посмотрю, что я могу сделать с этой информацией - person David Edgar; 19.03.2015