WebRTCサービスのGoInstant触ってみたので基本的なところを紹介してみまっす。
GoInstantの紹介は以下のWebサイトが詳しいです。
超カンタンに言うと、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します。
guestアカウントの表示名やJoinするRoomを指定するにはconnectメソッドの部分を
以下のように書き換えるだけ。
var userObj = {
user: {
displayName: "Test"
},
room: "TestRoom"
};
goinstant.connect(url, userObj, function(err, connection, room){
...
}
基本的にはこの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の場合はシークレット・ウィンドウを使うと楽です。
入退出するとこんな感じになります。
自分自身の情報を取得する
var myKey = room.self();
myKey.get().then(function(result){
console.log("myKey");
console.log(result);
});
ちなみにGuestアカウントですが、GuestでJoinするとlocalStorageに以下のようなデータが格納されます。
JWTっぽい。
あと、Guestの場合はidとかproviderとかgroupsは自動で割り振られて変更できません。
connectのところで以下のようにJWTを投げると、GuestではないAuthenticatedなUserでログインできます。
goinstant.connect(url, {user: jwt_token}, function(err, connection, room) {
...
});
JWTの生成はこの記事を参考ください。