Node-REDを使ってみる その6(サブフローの作成)
はじめに
今回はNode-REDのサブフローを作成してみました。
Node-REDのフローをまとめて、一つのノードのように扱うことができます。これまで使ったことは無かったのですが、作成したサブフローをノードとしてパッケージ化できることを知りました。
▼以下の記事で紹介されていました。
https://qiita.com/kazuhitoyokoi/items/2e34ad85caace099745f
私はこれまでノードを開発して公開してきました。いつもノード化する前に既存のノードで動作を確認するので、サブフローでパッケージ化できるなら楽になるかもしれません。
▼ノードの作成や公開については以下の記事で紹介しています。
まずはサブフローの作成を試してみました。
▼以前の記事はこちら
サブフローを作成してみる
簡単なサブフローを作成してみます。
▼サブフローのドキュメントはこちら
https://nodered.jp/docs/user-guide/editor/workspace/subflows
右上のメニューにサブフローの選択肢があります。
▼「サブフローを作成」を選択します。

▼サブフローが追加されました。

▼「プロパティを編集」をクリックすると、環境変数やモジュールの外観などの設定画面が開きました。

入力は0か1、出力は複数設定できるようになっています。この辺りは、Node-REDのノードを開発していたときと同様です。
▼数を変更すると、inputとoutputのノードが追加されました。

間にchangeノードを入れて、msg.payloadに値を代入するようにしました。
▼簡単なフローを作成しました。

通常のフロー画面に追加して、動作を確認してみました。
▼それぞれのoutputから、メッセージが出力されました。

出力が多いとピンの役割が分からなくなるのですが、ラベルを設定すると、マウスをホバーしたときに表示されるようになります。
サブフローの編集画面で「プロパティを編集」をクリックし、外観の欄でポートラベルを設定しました。
▼完了ボタンの下のタブにあります。以下のように設定しました。

▼出力ピンにマウスをホバーすると、ラベルが表示されました。

▼なお、サブフローのノードをダブルクリックすると、「サブフローのテンプレートを編集」というものがあります。ここから編集画面に戻れます。

サブフローを共有する
通常のフローでは書き出しによって共有することができますが、サブフローでもできるのか試してみました。サブフローを作成したものとは別のNode-REDで読み込みます。
▼私はNode-REDをExpressで起動しているので、npmでグローバルインストールしたNode-RED以外にも起動できます。
作成したサブフローを書きだしました。
▼フローを選択して右クリックすると、書き出しがあります。

書き出したものを別のNode-REDで読み込みました。
▼問題なく実行できました。

なお、書き出したものは以下です。サブフローを作成する際に設定していたラベルなどの情報が含まれていることが分かります。
[{"id":"4efd26e37a2a3ff0","type":"subflow","name":"Subflow 1","info":"","category":"","in":[{"x":240,"y":200,"wires":[{"id":"5f933e63733fc562"},{"id":"4f0eaf49b5e2223e"},{"id":"1459e7d8d9d83459"}]}],"out":[{"x":640,"y":200,"wires":[{"id":"1459e7d8d9d83459","port":0}]},{"x":610,"y":260,"wires":[{"id":"5f933e63733fc562","port":0}]},{"x":610,"y":320,"wires":[{"id":"4f0eaf49b5e2223e","port":0}]}],"env":[],"meta":{},"color":"#DDAA99","outputLabels":["おはようございます","こんにちは","こんばんは"]},{"id":"5f933e63733fc562","type":"change","z":"4efd26e37a2a3ff0","name":"こんにちは","rules":[{"t":"set","p":"payload","pt":"msg","to":"こんにちは","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":410,"y":260,"wires":[[]]},{"id":"4f0eaf49b5e2223e","type":"change","z":"4efd26e37a2a3ff0","name":"こんばんは","rules":[{"t":"set","p":"payload","pt":"msg","to":"こんばんは","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":410,"y":320,"wires":[[]]},{"id":"1459e7d8d9d83459","type":"change","z":"4efd26e37a2a3ff0","name":"おはようございます","rules":[{"t":"set","p":"payload","pt":"msg","to":"おはようございます","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":440,"y":200,"wires":[[]]},{"id":"f8741a2e252ded37","type":"subflow:4efd26e37a2a3ff0","z":"f2cd59c8032f4a75","name":"","x":640,"y":280,"wires":[["28d39455e5d71696"],["bd7af4b65c8849c2"],["f1a2c7d7051dab5f"]]},{"id":"d530617409cf6554","type":"inject","z":"f2cd59c8032f4a75","name":"","props":[],"repeat":"","crontab":"","once":false,"onceDelay":0.1,"topic":"","x":490,"y":280,"wires":[["f8741a2e252ded37"]]},{"id":"28d39455e5d71696","type":"debug","z":"f2cd59c8032f4a75","name":"debug 669","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":810,"y":240,"wires":[]},{"id":"bd7af4b65c8849c2","type":"debug","z":"f2cd59c8032f4a75","name":"debug 670","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":810,"y":280,"wires":[]},{"id":"f1a2c7d7051dab5f","type":"debug","z":"f2cd59c8032f4a75","name":"debug 671","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","statusVal":"","statusType":"auto","x":810,"y":320,"wires":[]}]最後に
サブフローを作成すると、簡易的なノードのようにまとめることで便利に使えそうです。私はUnreal Engineで開発することもあるのですが、ブループリントで関数を作るときに似ているなと思いました。
サブフローのパッケージ化についても試そうと思っています。


