Unity → Node-RED → obniz のシンプルな API サンプル

obniz ID の確認

7041d3bc8d1fcb8f2555a93d6b8b9412

今回動かしたい obniz の ID を電源を入れて確認しておきます。また、このまま起動し続けて、実際に検証もしましょう。

Node-RED にノードをインストール

alt text

Node-RED に node-red-contrib-obniz ノードをインストールします。

今回の Flow

alt text

今回の Flow はこちらです。

[{"id":"822e72346d41bc50","type":"http in","z":"b98bbcbc928c63e8","name":"","url":"/api/obniz/message","method":"get","upload":false,"swaggerDoc":"","x":150,"y":80,"wires":[["73fd0af73d129ab7","8c8dc8095ca2a61a","6f73700a27c9c91f"]]},{"id":"a79f8485fbc69360","type":"inject","z":"b98bbcbc928c63e8","name":"{\"message\":\"Hello! obniz!\"}","props":[{"p":"payload"},{"p":"topic","vt":"str"}],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","payload":"{\"message\":\"Hello! obniz!\"}","payloadType":"json","x":170,"y":180,"wires":[["73fd0af73d129ab7"]]},{"id":"8c8dc8095ca2a61a","type":"http response","z":"b98bbcbc928c63e8","name":"","statusCode":"","headers":{},"x":390,"y":80,"wires":[]},{"id":"73fd0af73d129ab7","type":"obniz-function","z":"b98bbcbc928c63e8","obniz":"ef1a48c91df7d30f","name":"","code":"// 接続がされている前提で動かせる\r\n// ディスプレイのクリア\r\nobniz.display.clear();\r\n// ディスプレイに表示\r\nobniz.display.print(msg.payload.message);","x":420,"y":120,"wires":[[]]},{"id":"b8e0b9800914058e","type":"comment","z":"b98bbcbc928c63e8","name":"テスト用","info":"","x":120,"y":140,"wires":[]},{"id":"6f73700a27c9c91f","type":"debug","z":"b98bbcbc928c63e8","name":"debug 1","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":400,"y":40,"wires":[]},{"id":"ef1a48c91df7d30f","type":"obniz","obnizId":"","deviceType":"obnizboard","name":"","accessToken":"","code":""}]

こちらの JSON データをインポートします。

alt text

デプロイします。

11c7e71570be22fdfd2f21c802ed401c

obniz function ノードをダブルクリックしてプロパティを表示します。

9800729cf8350662d184347203a2b554

obniz という項目で obniz() を選択して鉛筆ボタンをクリックします。

f443c4062d11d44ab294495d49e12096

obniz ID の項目に、さきほど電源を入れて確認した obniz の ID を入力して更新をクリックします。

2b5a87fb6f597649270cec66a2dd2d3d

obniz ID の項目では設定した ID が反映されています。完了ボタンをクリックします。

ワークスペースの右上の保存ボタンをクリックして、フローをデプロイします。

サーバー URL 把握

これで Node-RED によるサーバーができました。

今回は、この一時的に使っているエディタそのもののサーバー URL で試してみます。

8355eb99ba9f5b82bf84301dbb7574ae

右上の i というアイコンをクリックします。

31d22a4c38d78b46dc9d6623573f5136

URL をテキスト選択してコピーします。

Node-RED からテストしてみる

f899e46f004623b6277592fb17a6858b

こちらの inject ノードをクリックしてみます。obniz ID が合っていて obniz が起動していれば動作します。

580f4be6c2fdd509c0e715c234e3798d

obniz が inject ノードで送られた「Hello! obniz!」というメッセージで内蔵ディスプレイが動作します。

ブラウザで動かしてみる

ブラウザで別タブを開いて API URL にアクセスしてみます。API URL はさきほどのサーバー URLに /api/obniz/message?message=enebular を加えたものです。

message=enebular 部分が API に実際にデータを送って保存する message 値です。

もし https://hogehoge123456789.herokuapp.com/ がサーバー URL なら https://hogehoge123456789.herokuapp.com/api/obniz/message?message=enebular となります。

5bb93f41e5c698c6900819a4bfb16e03

このように送られた message 値がオウム返しされています。無事データが送られています。

68a1d660a209a183a41d8b03841f83c1

そして、obniz がブラウザから送られた message 値の「enebular」というメッセージで内蔵ディスプレイが動作します。

これで Node-RED の準備が完了です。

Unity のバージョン

Unity の準備をします。

2020.3.48f1 のバージョンでプロジェクトを作成してます。

それ以降のバージョンでも動くプログラムのはずです。

Unity に Cube を準備

be9e58c3e9aa39df46fed6ea186ba072

Unity に Cube を準備します。今回は Play ボタンで起動するだけで動作を目指します。

Cube に CubeEvent.cs を割り当て

Cube に CubeEvent.cs を割り当てます。

using UnityEngine;
using System.Collections;       // IEnumerator のための参照
using UnityEngine.Networking;   // UnityWebRequest のための参照

public class CubeEvent : MonoBehaviour
{
    // アクセスする URL
    string urlAPI = "ここにURLを入れる";

    // 起動時の動作
    void Start()
    {
        // HTTP GET リクエストを非同期処理を待つためコルーチンとして呼び出す
        StartCoroutine("GetAPIData");
    }

    // GET リクエストする本体
    IEnumerator GetAPIData()
    {
        // HTTP リクエストする(GET メソッド) UnityWebRequest を呼び出し
        // アクセスする先は変数 urlGitHub で設定
        UnityWebRequest request = UnityWebRequest.Get(urlAPI);

        // リクエスト開始
        Debug.Log("リクエスト開始");

        yield return request.SendWebRequest();

        // 結果によって分岐
        switch (request.result)
        {
            case UnityWebRequest.Result.InProgress:
                Debug.Log("リクエスト中");
                break;

            case UnityWebRequest.Result.ProtocolError:
                Debug.Log("ProtocolError");
                Debug.Log(request.responseCode);
                Debug.Log(request.error);
                break;

            case UnityWebRequest.Result.ConnectionError:
                Debug.Log("ConnectionError");
                break;

            case UnityWebRequest.Result.Success:
                Debug.Log("リクエスト成功");

                // コンソールに表示
                Debug.Log($"responseData: {request.downloadHandler.text}");

                break;
        }


    }
}

Unity の CubeEvent.cs 変更

    // アクセスする URL
    string urlAPI = "ここにURLを入れる";

こちらの ここにURLを入れる の部分に、さきほどのサーバー URLに /api/obniz/message?message=unity を加えたものを上書きして保存します。

message=unity 部分が API に実際にデータを送って保存する message 値です。

もし https://hogehoge123456789.herokuapp.com/ がサーバー URL なら https://hogehoge123456789.herokuapp.com/api/obniz/message?message=unity となります。

Unity を動かしてみる

ここまで設定できたら Unity で Play ボタンを押して動かしてみます。

025629e2c70b5c295b743fcb98e7f22a

Node-RED 側で debug ノードでデータが受信されて、今回受け取ったパラメータが受け取れています。

f2438c1a9d7148c4d1465fd605331572

Unity 側のコンソールで送受信が成功します。Node-RED が受け取ったデータをそのままオウム返しするので {"message":"unity"} が返答されます。

c93ca7e70c7218e86897589e542a3322

obniz は Unity から Node-RED 経由送られた message 値の「unity」というメッセージで内蔵ディスプレイが動作します。

results matching ""

    No results matching ""