Milkcocoaの疎通確認

f:id:tbpg:20160222224047j:plain

Milkcocoaの疎通確認をします。 ※激しく既出の内容です。個人メモとしての記事なので新たな何かを求めている方は特にみるべきところはありません。

前提

npmはインストール済み
npmのversionは5.1.1とする

手順

Milkcocoa アプリ作成手順

下記ページを参考に登録をする。

mlkcca.com

ユーザー登録

登録メールのリンク先に訪問すると以下の画面が表示され、ユーザー登録が完了します。

f:id:tbpg:20160222224055p:plain

アプリケーション登録

新しいアプリを作るボタンでアプリを作成します。

f:id:tbpg:20160222224100p:plain

疎通確認

アプリケーション登録後、 app_id をコピーし、以降の your_id の部分に設定します。

送信側

※古代のJSであることをスルーしていただけると幸いです

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <title>Milkcocoa Sample</title>
  <script src="https://cdn.mlkcca.com/v2.0.0/milkcocoa.js"></script>
  <script type="text/javascript">
function milkcocoaTest() {
  var milkcocoa = new MilkCocoa('your_id.mlkcca.com');
  var ds = milkcocoa.dataStore('users');
  ds.send({name : 'tanaka', age : 23});
}
  </script>
</head>
<body>
  <form>
    <input type="button" value="test" onclick="milkcocoaTest();">
  </form>
</body>
</html>

モニター側

コンソールの出力を確認

<script src="https://cdn.mlkcca.com/v2.0.0/milkcocoa.js"></script>
<script type="text/javascript">
var milkcocoa = new MilkCocoa('your_id.mlkcca.com');
var ds = milkcocoa.dataStore('users');
ds.on('send', function(sended) {
  console.log('sendされました！'+sended.value.name+'('+sended.value.age+')');
});
</script>