データストアについて

データストアとは、クライアント間のデータのやり取りを担ったり、データを保存したりする場所のことで、/で区切られた階層構造をもっています(Milkcocoa SDKで作成するdataStoreオブジェクトはデータストアを操作するためのオブジェクトです)。

データストアには柔軟なアクセス制御をかけることができます。

簡単な例として以下のような階層の場合に、「public以下は全ユーザーにAPIを許可」して、「private以下は、ユーザーごとにそのユーザーのユーザー名以下のデータストアしかAPIを許可しない」といったアクセス制御が出来ます。

/public/
/public/todos/
/private/
/private/user1/
/private/user1/todos/
/private/user2/
/private/user2/todos/
/private/user3/
/private/user3/todos/
/private/user4/
/private/user4/todos/

具体的なアクセス制御の方法は、セキュリティルールのドキュメントをご覧下さい。

管理画面でのデータストア操作

管理画面上で、データストアに保存されたデータの閲覧、削除をGUIから行えます。

データストアの表示

選択したデータストアをリスト形式で表示できます。

以下が、表示画面です。それぞれのデータには、クライアント側から送信した値(value)に加え、「自動的に割り当てられるデータごとにユニークなID(id)」と「作成(更新)された日時(timestamp)」を持っています。1行が1dataに相当し、無料プランでは100,000dataまで保存できます。

管理画面上で、選択したデータの削除も行えます。削除したいデータを選択して、「選択項目を削除」で削除をします。

※注:月に100,000データ以上を削除するとデータの取得が使えなくなってしまいますので、ご注意ください。

データのリアルタイム可視化(freeboard)

※こちらはβ版になります。Google Chromeでのみ動作確認をしています。

freeboardというオープンソースの可視化ライブラリを使って、Milkcocoaに送信したデータをリアルタイムに可視化できます。

使い方

アプリの管理画面の「データストア」の「データ可視化(β版):FreeBoard(Chromeでご利用下さい)」をクリックします。

すると、以下のような画面が開かれるので、まず、DATASOURCESの登録をしましょう。[ADD]をクリックします。

DATASOURCEのTYPEを聞かれるので、「Milkcocoa」を選びましょう。

NAMEにデータソースの名前(適当な文字列)、DATASTOREに使用するデータストア名、APIに使用するMilkcocoaのAPIを入力します。今回はデータストアをmessage、APIをsendにしましょう。

すると、以下のようにデータソースが追加されます。まだデータが来ていないのでLast Updatedの部分がneverになっています。

グラフを追加する前に、データを投げつつけるマシンを作っておきましょう。

PC上で新しいnpmプロジェクト作成して、npm i milkcocoaでMilkcocoaのNode.jsのSDKをインストールします。

インストールが終わったら、以下のような1秒ごとにsend()を発行するようなコードを書いて、node test.jsで実行しましょう。

test.js
var MilkCocoa = require('milkcocoa');
var milkcocoa = new MilkCocoa('your-app-id.mlkcca.com');
setInterval(function(){
    milkcocoa.dataStore('message').send({v:23});
}, 1000);

実行すると、Last Updatedの部分がsend()でデータが送られて来た時刻になるかと思います。

Last Updatedが更新されることが確認できたら、グラフを作成しましょう。「ADD PANE」をクリックします。

すると、PANE(四角いボード)が作成されるので、右上の「+」ボタンでデータソースの設定をしましょう。

色々TYPEがありますが、今回は「Gauge(半円でデータの量を表現するもの)」にしましょう。TITLEは適当に入力して、VALUEの部分は、右にある「+ DATASOURCE」を押して先ほど設定したデータソースを選択します。そこからは勝手に候補を出してくれるので、「value」→「v」と選択します。

これで「SAVE」を押すと画面にグラフが表示されます。

基本的な使い方は以上です。センサーデータ等を登録してPANEを増せば、ちょっとした監視用途で利用できますね。