Meteorでユーザのオンライン状態を取得するためのパッケージ

Meteorではクライアントは常にサーバに接続しているため、クライアント(ユーザ)の状態を取得することが容易であるはずです。本記事では、それを簡単に行うためのパッケージを紹介します。

user-status

mizzao:user-statusは、ユーザの接続状態を取得するパッケージです。ユーザの接続状態とは、IPアドレスやブラウザの種類(user-agent)やクライアントでの活動などです。これらの情報が通常のMeteor.usersでアクセスできるようになります。

具体的に何ができるかは、デモやソースコードを参照するとよいでしょう。

インストール方法

いつも通り、

$ meteor add mizzao:user-status

としてパッケージをインストールします。

リバースプロクシを設置している場合は、クライアントの正しいIPアドレスを取得するためにHTTP_FORWARDED_COUNT環境変数を設定しなければなりません。詳しくは、ドキュメントを参照のこと。

基本的な使い方

Meteor.usersにstatusフィールドが追加され、ユーザの接続状態が自動で更新されます。userIdに対応する接続が一つでもあればそのユーザは接続しているとみなされます。statusには下記のフィールドがあります。

online: このユーザに対応するコネクションが一つでもあればtrueになります
lastLogin: このユーザが最も最近ログインした情報がdateとipAddrとuserAgentで指定されます
idle: このユーザに対応するすべてのコネクションがアイドル状態の場合trueになります
lastActivity: このユーザがアイドル状態の場合、最後にアクションがあった時刻で、ユーザがオンラインかつアイドルの場合にのみ利用可能です

このstatusフィールドをクライアント側からもアクセスできるようにするには、例えば次のようにサーバでpublishします。

Meteor.publish('userStatus', function() {
  return Meteor.users.find({
    'status.online': true
  });
});

必要に応じてfieldsオプションでpublish範囲を制限してください。

もしくは、次のように個別にオンラインやオフラインになった時の処理を記述することもできます。

Meteor.users.find({ "status.online": true }).observe({
  added: function(id) {
    // id just came online
  },
  removed: function(id) {
    // id just went offline
  }
});

Meteor.usersをクライアントで使う場合は、例えば、テンプレートのヘルパーに設定します。

Template.foo.helpers({
  usersOnline: function() {
    return Meteor.users.find({
      'status.online': true
    });
  }
});

高度な使い方

Client API

クライアントではUserStatusというオブジェクトでクライアント活動のモニタリングを行います。デフォルトでは、windowのクリックイベントとキーイベント(keypress)を監視してアクションの有無を判定します。UserStatusには下記の関数が設定されています。

startMonitor: アイドル判定を開始する関数です。引数は、threshold(アイドルとみなすまでの時間)、interval(アイドル判定をする頻度)、idleOnBlur(windowのblurイベントをアイドルとみなすか)の3つです
stopMonitor: 監視を止める関数です
pingMonitor: 手動で一度だけ監視するための関数です
isIdle: 現在アイドル状態かを示すリアクティブ変数です
lastActivity: 最後にアクション(クリックもしくはキー)が起こった時刻を保持するリアクティブ変数です。これを使うと再計算が頻繁に発生するため、デバッグなどの用途に留めるべきです

Server API

UserStatus.connectionsというインメモリコレクションがすべてのコネクションの情報を保持します。各情報には下記のフィールドがあります。

_id: コネクションIDです
userId: 認証している場合のユーザIDです
ipAddr: クライアントのIPアドレスです
userAgent: ブラウザのUser-Agentです
loginTime: 認証している場合のログイン時刻です
idle: アイドル監視をしていて、クライアントがアイドル状態になるとtrueになります

UserStatus.eventsオブジェクトはEventEmitterでユーザのログイン/ログアウトの変更を受け取れます。ブラウザの終了はログアウトとみなされ、新しいブラウザウィンドウは新しいログインとみなされます。下記のイベントがサポートされています。

UserStatus.events.on('connectionLogin', function(fields) { ... })
UserStatus.events.on('connectionLogout', function(fields) { ... })
UserStatus.events.on('connectionIdle', function(fields) { ... })
UserStatus.events.on('connectionActive', function(fields) { ... })

感想

以上で紹介したように、アイドル判定はそれなりに苦労しているものの、全体としてはMeteorとうまく融合した便利なパッケージになっていると思います。Meteorの魅力の一つは豊富なパッケージなので、ぜひ活用したいところです。

Menu

Meteor Fan (日本語情報)

JavaScriptフレームワークMeteorに関していろいろ紹介する日本語情報サイト