2014-04-11

GoInstant触ってみた【User Presence&Data編】

WebRTCサービスのGoInstant触ってみたので基本的なところを紹介してみまっす。

 

GoInstantの紹介は以下のWebサイトが詳しいです。

リアルタイムBaaS「GoInstant」の概要

 

超カンタンに言うと、GoInstantはチャットやWeb会議的なリアルタイムコミュニケーションアプリを

簡単に作るためのサービス(Baas)です。

 

GoInstantではRoomという概念があります。

これはデータ伝達範囲の単位で、GoInstantでは同一Room内でのみデータのやり取りが行われます。

GoInstantではRoomに対して各ユーザがJoin(ログイン的なもの)して、Room内のデータを操作したり

同一Roomの他のユーザがデータを更新したら、即座に画面に反映したりといったことが出来ます。

一人のユーザが複数のRoomにJoinすることもできます。

 

Room内のデータは階層構造で持っていて、JSONみたいな感じです。

JSONのプロパティに当たる部分をGoInstantではkeyと呼びます。

(むしろJSONでもkeyって呼ぶ気がするけど…)

 

概念的なことはさておき、これ以上説明するとボロが出る百聞は一見に如かずということで、

実際にコードを書いていきます!

 

GoInstantに接続(RoomにJoin)

以下のようなコードを書けばOK。
<!DOCTYPE html>
<html>
  <head>
  <meta charset="utf-8"/>
    <script src="https://cdn.goinstant.net/v1/platform.min.js"></script>
    <script>
    var url = "https://goinstant.net/xxxx/*****";
    goinstant.connect(url, function(err, connection, room){
        if (err) {
            console.log(err);
        }
        console.log(room);
    });   
    </script>
  </head>
<body>
</body>
</html>

これを実行するとguestアカウント(匿名)としてデフォルトのRoomである[Lobby]にjoinします。

lobby

 

guestアカウントの表示名やJoinするRoomを指定するにはconnectメソッドの部分を

以下のように書き換えるだけ。

var userObj = {
    user: {
        displayName: "Test"
    },
    room: "TestRoom"
};
goinstant.connect(url, userObj, function(err, connection, room){
...
}

TestRoom

 

基本的にはこのconnectを実行した後の非同期コールバック関数の引数に入る

roomやconnectionを使って色々と操作をすることになります。

 

Room内にJoinしているユーザ一覧を取得する

connect実行後のコールバック関数のroomオブジェクトを使って
room.users.get().then(function(result){
    var users = result.value;
    var userIds = Object.keys(users);
    userIds.forEach(function(id){
        console.log(users[id].displayName);
    });
});

と書けばOK。

 

room.usersはroom.key("./users"))と同じで

対象RoomにJoinしているユーザリストのkeyを取得します。

 

Object.keys(users)でusersオブジェクトのキーを全て取得してます。

arrayだったらforで回せば良いですが、ユーザ一覧としてユーザIDをプロパティとしたオブジェクトが

返ってくるため、一覧を取得するにはキー値を全て取得する必要があります。

 

 

上記の方法はPromiseを使ってます。

Promiseを使わないやり方だと、get(function(){})って感じになって

後続の処理があったりするとコールバック&ネスト地獄になるので、Promise使った方がスッキリします。

 

connectの部分もPromiseを使うと

goinstant.connect(url, userObj).then(function(result){
    console.log(result.connection);
    console.log(result.rooms);
});

と書き換えることができます。

 

Roomへの入退出(Join,Leave)を検知して処理する

room.on("join", function(data){
    console.log("join " + data.displayName);
    console.log(data);
});

room.on("leave", function(data){
    console.log("leave " + data.displayName);
    console.log(data);
});

 

検証するにはGoInstantをサポートするブラウザを2つ立ち上げて、同一RoomにJoinします。

Chromeの場合はシークレット・ウィンドウを使うと楽です。

 

入退出するとこんな感じになります。

joinGuest

leaveGuest

 

自分自身の情報を取得する

var myKey = room.self();
myKey.get().then(function(result){
    console.log("myKey");
    console.log(result);
});

 

ちなみにGuestアカウントですが、GuestでJoinするとlocalStorageに以下のようなデータが格納されます。

JWTっぽい。

guestId_localstorage

 

あと、Guestの場合はidとかproviderとかgroupsは自動で割り振られて変更できません。

 

connectのところで以下のようにJWTを投げると、GuestではないAuthenticatedなUserでログインできます。

goinstant.connect(url, {user: jwt_token}, function(err, connection, room) {
...
});

JWTの生成はこの記事を参考ください。

 

 

このエントリーをはてなブックマークに追加