LoginSignup
2
2

More than 5 years have passed since last update.

BeebotteのデータをProxy越えする

Last updated at Posted at 2017-01-11

はじめに

IFTTTのActionをローカルのIEEE1888ストレージに保存したいので、Beebotte経由でMQTTで使用としたが、Proxyを使ったFirewallのため、MQTTを通さずあえなく撃沈した。
従って、以下の様な仕組みを検討した。
x1.png
Beebotteの設定はチャンネルを”ifttt”、リソースを”action”としています。
BeebotteとWebページの間は、MQTT over Websocktと思うが、ドキュメントには明記されていない。

IEEE1888ストレージのインストール

今回はVM上にインストールした。

ubuntuのインストール

Ubuntu 12.04 LTS (Desktop)をインストールした。
インストール後、画面が表示されない不具合があったが、ctrl+shift+F1で別ターミナルを開き

#sudo apt-get update
#sudo apt-get upgrade

で最新状態にして再起動したら無事に画面表示した。

IEEE1888ストレージのインストール

http://fiap-develop.gutp.ic.i.u-tokyo.ac.jp/dist/
のFIAPStorage単体のダウンロード
 >FIAPStorage2: Axis2 1.6系, Tomcat7, JRE7, Ubuntu 12.04 LTS 向け
  >FIAPStorage2-20131011
をインストールする。
途中psqlの行がエラーが出たので、

#psql -d fiapstorage2 -f fiapstorage2.sql

とした。
なおWebはデータがpointIdが2つ以上にならないと表示されないみたい。(無いときはないって表示するけど)

BeebotteのWebSocketの確認

Beebotteの設定は http://qiita.com/mayfair/items/e761c788a9d8787bc610
を参照

IFTTT

MakerChannelは以下の様な感じ
x2.png
URLが、Publishでないといけません。WriteだとWebまで行きません。

Webページ

以下のソースを実行してIFTTTの内容が反映されるか確認します。IFTTTのタイムラグは最大15分ありますが、大抵30秒程度です。

<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script src="http://beebotte.com/bbt.js" ></script>
</head>
<body>
<p>メッセージが届くと下に表示します。</p>
<div id="MsgBox" style="background:pink"></div>
<script type="text/javascript">
var bbt = new BBT('API_KEY');
bbt.subscribe( {channel: 'ifttt', resource: 'action'}, function(message){
   console.log(message.data);
   ocument.getElementById("MsgBox").textContent=message.data;
});
</script>
</body>
</html>

FIAPStorageへのWriteを加えたもの

<!DOCTYPE html>
<html>
<head>
<script src="https://cdn.socket.io/socket.io-1.4.5.js"></script>
<script src="http://beebotte.com/bbt.js" ></script>
<script type="text/javascript">
var pointid="http://test.jp/ifttt_btn";
var fiapStorage="http://192.168.203.130/axis2/services/FIAPStorage";
var bbt = new BBT('API_KEY');
</script>
</head>
<body>
<p>メッセージが届くと下に表示します。</p>
<div id="MsgBox" style="background:pink"></div>

<hr />  
<p>FIAPStorageへの送信XMLを下に表示します。</p>
<div id="sndFiap" style="background:lime"></div>

<hr />  
<p>FIAPStorageからの返信を下に表示します。</p>
<div id="retFiap" style="background:aqua"></div>

<script type="text/javascript">
function content (id,msg){
var date = new Date();
var str="<?xml version=\"1.0\" encoding=\"utf-8\" ?>" + 
        "<soapenv:Envelope xmlns:soapenv=\"http://schemas.xmlsoap.org/soap/envelope/\">" +
        "<soapenv:Body>" +
        "<ns2:dataRQ xmlns:ns2=\"http://soap.fiap.org/\">" +
        "<transport xmlns=\"http://gutp.jp/fiap/2009/11/\">" +
        "<body>" +
        "<point id=\"" + id + "\">" +
        "<value time=\"" + date.getFullYear() + "-" + 
        ('0' + (date.getMonth() + 1)).slice(-2) + "-" + 
        ('0' + date.getDate()).slice(-2) + "T" + 
        ('0' + date.getHours()).slice(-2) + ":" + 
        ('0' + date.getMinutes()).slice(-2) + ":" + 
        ('0' + date.getSeconds()).slice(-2) + "+09:00\">" +
        msg + "</value>" +
        "</point>" +
        "</body>" +
        "</transport>" +
        "</ns2:dataRQ>" +
        "</soapenv:Body>" +
        "</soapenv:Envelope>";
return str;
}

bbt.subscribe( {channel: 'ifttt', resource: 'action'}, function(message){
   console.log(message.data);
   document.getElementById("MsgBox").textContent = message.data;
   document.getElementById("sndFiap").textContent = content(pointid,message.data);

   var request = new XMLHttpRequest();
   request.onreadystatechange = function()
   {
       if(request.readyState == 4)
       {
           if(request.status == 200)
           {
               var head = request.getAllResponseHeaders();
               var contentType = head.match(/Content-Type:([^\n]*)/)[1].trim();
               var text;
               switch(contentType){
                   case 'text/xml':
                       text = request.responseXML;
                       break;
                   default:
                       text = request.responseText;
               }
               document.getElementById("retFiap").textContent = text;
           }
           else if(request.status == 404)
           {
               document.getElementById("retFiap").textContent ='404 file not found';
           }
           else if(request.status == 0)
           {
               document.getElementById("retFiap").textContent ='ローカルファイルまたは別ドメインにアクセスしている可能性があります。';
           }
       }
   }
   request.open('POST',fiapStorage);
   request.setRequestHeader("SOAPAction", "\"http://soap.fiap.org/data\"");
   request.send(content(pointid,message.data));
   console.log("送信終了");
});
</script>
</body>
</html>

http://jmqys.hatenablog.com/entry/2015/07/13/092033 を参考にさせていただきました。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2