読者です 読者をやめる 読者になる 読者になる

アプリカンブログ

HTML5でiOS/Androidアプリが開発できるプラットフォーム、アプリカンのブログです。

WebSocketを使ってIoTデバイスとアプリカンアプリの通信を試す

IoTという単語がよく聞かれるようになりましたが、マイコンやセンサーに慣れた組み込み系の人だけが楽しめるもののように感じてしまっていないでしょうか。スマートフォンも各種センサーがあり、ネットワークにも常時繋がっているなどIoTデバイスとして十分な性能を持っていますが、やはり小さなデバイス(ArduinoやIntel Edison、Raspberry Piなど)と接続したいと考える人は多いようです。

そこで今回はIoTデバイスとアプリカンをつなぐ方法について紹介します。使うのはNode.jsになりますので、アプリカンと同じくJavaScriptだけで作れるのが利点です。

WebSocketサーバを立てる

IoTデバイスとアプリカンアプリをつなぐのはWebSocketになります。WebSocketはサーバが必要になりますので、今回は母艦になるPC上に立ててみたいと思います。使うのはwebsocketserverというライブラリです。

mkdir websocket
cd websocket
npm init
npm install websocketserver --save

サーバのコードは今回は簡単にメッセージを受け取ったらサーバに繋がっている全クライアントに流すだけというものになります。コードは次のようになります。

var WebSocketServer = require("websocketserver");
var server = new WebSocketServer("all", 8080);

var connectionList = [];
server.on("connection", function(id) {
  console.log("connected:"+id);
  connectionList.push(id);
});

server.on("message", function(data, id) {
    var mes = server.unmaskMessage(data);
    var str = server.convertToString(mes.message);
    console.log(str);
});


server.on("closedconnection", function(id) {
    console.log("Connection " + id + " has left the server");
});

これを実行すると8080番ポートで待ち受け状態になります。

IoTデバイスを準備する

今回はIntel Edisonを使います。照度センサーをつけています。一番最初に読み込んでいるmraaというのはIntel Edisonから各種センサーを扱うのを手軽にしてくれるライブラリになります。内容はコメントを参照してください。

var mraa = require ('mraa');

// 照度センサーはアナログ0番に接続しています。
var light = new mraa.Aio(0);
// 明るさを格納する変数
var lightValue;

// WebSocketサーバに接続するクライアントを準備します。
var WebSocketClient = require('websocket').client;
var client = new WebSocketClient();

// 接続エラー時の処理
client.on('connectFailed', function(error) {
    console.log('Connect Error: ' + error.toString());
});

// 接続完了時の処理
client.on('connect', function(connection) {
  console.log('WebSocket Client Connected');
  
  // 接続した後でエラーが起きた場合
  connection.on('error', function(error) {
      console.log("Connection Error: " + error.toString());
  });
  
  // 接続が閉じた場合
  connection.on('close', function() {
      console.log('echo-protocol Connection Closed');
  });
  
  // メッセージを受信した時
  connection.on('message', function(message) {
    if (message.type === 'utf8') {
      console.log("Received: '" + message.utf8Data + "'");
    }
  });

  // 照度を送信する処理
  // 3秒ごとに実行しています
  function sendNumber() {
    if (connection.connected) {
      // 照度を計算しています
      lightValue  = light.read();
      lightValue = Math.round( lightValue*.1);
      
      // WebSocketサーバにUTFで送信します
      connection.sendUTF(lightValue);
      setTimeout(sendNumber, 3000);
    }
  }
  sendNumber();
});

// 今回は以下のアドレスに接続します
client.connect('ws://192.168.0.14:8080/');

実行すると、次のように3秒ごとに照度を計測し、その結果をWebSocketサーバに送信します。

f:id:moongift:20151021133911p:plain

アプリカンアプリの作成

アプリカンアプリはWebSocketアプリのデモコードを利用します。そして接続先だけ上記コードと同じアドレスに変更します。

openWebSocket = function() {
  applican.webSocket.open("ws://192.168.0.14:8080", // ここだけ変更
    webSocketOnOpen,
    webSocketOnMessage,
    webSocketOnClose,
    webSocketOnError
  );
};

これで準備は完了です。修正したコードをアプリカンの管理画面からアップロードしてアプリカンシミュレータ(iOS/Android)で確認してみましょう。

実行してみる

実行しているところです。照度が変化(指で隠すと暗くなります)すると、その値がアプリカンアプリに通知されます。

f:id:moongift:20151021133921p:plain

逆にアプリカンアプリからメッセージを送ることもできます。このメッセージはIoTデバイス側でも受信できますので、その内容に応じてセンサーを切り替えるようなことも可能です。下の画像のセンサーを変更と言うメッセージがそうです。

f:id:moongift:20151021133932p:plain


アプリカンアプリではWebSocketの他にもBluetoothを扱うこともできます。IoTのプロトタイプ開発ではNode.jsが利用されることが多々あります。アプリカンアプリ開発で培ったJavaScriptを使い、スマートフォンのAPIと組み合わせたIoTを楽しんでみてください。

アプリカン | アプリ開発支援プラットフォーム