More than 3 years have passed since last update.

Node-RED1.3の新機能: サブフローのノード化

Last updated at 2021-04-27Posted at 2021-04-19

株式会社日立製作所
サービスコンピューティング研究部
西山博泰

はじめに

プログラミングの手間を劇的に削減しアプリケーション開発者の裾野を広げるNo CodeやLow Codeといったキーワードが注目を集めています。Node-REDはコーディングレスでプログラムを作成できるLow Codeプログラミングツールであり、IoT分野を筆頭に様々な分野で活用されています。

Node-REDでは、ノードと呼ばれる機能ブロックををつなぎ合わせることで、とても簡単にプログラムを作成することができます。こういったノードには、乱数生成など簡単なユーティリティノードから、SNSからの情報収集、今流行りの機械学習を行うためのノードなど様々なノードが存在し、それらはOSSノードとして多数公開されています。

2021年4月、Node-REDの最新版であるバージョン1.3がリリースされました。Node-RED 1.3では、アプリケーションの開発を容易化するさまざまな機能が新しく導入されました。一連の記事でNode-RED 1.3の新機能を紹介したいと思います。

この記事では、新機能のうち筆者らが開発に参画したサブフローのノード化について紹介します。

Node-REDフロー

Node-REDではノードと呼ばれる部品を組み合わせてプログラムを構成します。例として、文字列から指定した正規表現にマッチした行のみを切り出すフローを作成してみましょう。

以下に示すフローは、splitノードで入力文字列を1行毎のメッセージに分解(「行分割」)し、switchノードで正規表現にマッチするメッセージのみを選択(「正規表現マッチ」)、選択したノードをjoinノードで結合(「再結合」)します。これにより、正規表現にマッチした行のみが切り出されます。

switchノードの設定は次の通りです。「^[JU]」という正規表現にマッチする入力メッセージをフィルタリングして出力します。設定では、「メッセージ列の補正」というチェックボックスをチェックしています。splitは文字列を改行文字(\n)で分割してメッセージグループを構成します。「メッセージ列の補正」をチェックすると、出力ポート毎にメッセージグループを構成し、joinノードで再結合可能となります。この例では、正規表現にマッチする行のみからなるメッセージグループをフィルタリングし、joinノードで結合します。

例えば、入力として次の文字列を与えると、

Canada
France
Geermany
Italy
Japan
Russia
United Kingdom
United States

先頭が「J」または「U」から始まる行が切り出されて出力されます。

Japan
United Kingdom
United States

サブフロー

先程の例では、3つのノード(split、switch、join)を使って行を切り出す処理を定義しました。この一連の処理を再利用したい場合、一つのノードの形でまとまっていると便利です。サブフローはこのような再利用を行いたいフローの一部を一つのノードのように扱うための仕組みです。

先程の例で、split、switch、joinの3つのノードを選択し、メニューから「サブフロー→選択部分をサブフロー化」を選択すると、選択したノードをまとめたサブフローが作成され、パレットに追加されます。

サブフローの定義を「サブフローテンプレート」、そのフロー中での使用を「サブフローインスタンス」と呼びます。パレットに追加されたサブフローをダブルクリックするか、サブフローインスタンスの設定から「サブフローのテンプレートを編集」ボタンをクリックすると、サブフローテンプレートの編集タブがオープンします。

サブフローテンプレートの編集タブを以下に示します。

サブフローテンプレートの編集タブでは、サブフローを構成するノードを編集するのに加えて、「プロパティを編集」ボタンをクリックすることでサブフローに関する付加情報を設定できます。設定可能な付加情報としては、

環境変数およびその設定UI
カテゴリ、色、アイコン
説明文

などを設定できます。先程の例で、検索に用いる正規表現を設定できるようにしてみましょう。サブフローの設定は、環境変数を用いて行います。

サブフローのカスタマイズには環境変数を利用します。環境変数はノードの設定に用いる変数で、ノードの実行開始前にその値が設定されます。サブフローに対する環境変数の設定では、入力フィールド識別用のアイコンやラベル、入力形式などを定義できます。

この例では、PATという名称の環境変数とその入力UIを定義しています。生成される設定UIは、「UIプレビュー」タブで確認できます。抽出対象の行にマッチする正規表現は検索フィールドに指定します。

switchノードのマッチングパターンには、環境変数「PAT」を指定します。これにより、サブフローテンプレートのUI定義で定義した正規表現を用いて行の抽出を行うことができます。

ノードの外観も変更しましょう。

サブフローの見た目を変更することによって、より通常のノードらしく見えるようになります。

サブフローのノード化

さて、先程の例では、入力文字列から正規表現にマッチする行を抜き出すサブフローを定義しました。Node-RED 1.2まで、サブフローはフローの一部としてエクスポートすることは可能でしたが、一般のノードのように独立して配布・再利用することはできませんでした。
この問題に対処するため、サブフローをJSONファイルとしてダウンロードし、それをノードとして読み込む機能がNode-RED 1.3で[新機能](Packaging a Subflow as a module : Node-RED)として導入されました。
先程作成したサブフローを例に、サブフローのノード化を行ってみましょう。

1. サブフローの作成

先程のサブフローを定義します。

2. モジュール情報の定義

サブフローテンプレート編集パネルの「モジュールプロパティ」設定タブにモジュール情報を定義します。この情報はNode-REDのノード開発の際のパッケージ化におけるpackage.jsonの記述内容に沿ったものですので、そちら(Packaging : Node-RED)も参考にしてください。

それぞれの定義項目は次の通りです。

モジュール: モジュールの名称を定義します。通常、node-red-contrib-で始まる名称とします。
ノードの型: ノードの内部名を定義します。
バージョン: x.y.z形式(x=メジャーバージョン、y=マイナーバージョン、z=パッチバージョン)のバージョンを指定します。
説明: 簡単な説明を記入します。
ライセンス: 公開する際のライセンスを指定します。
作者: 作者の情報を記入します
キーワード: ノードに関するキーワードをカンマ(,)区切りで記入します。node-redをキーワードに含める必要があります。

3. 作業ディレクトリの作成

作業のためのディレクトリを作成します。以下の作業はこのディレクトリで行います。

4. `package.json`の作成

Node-REDに読み込み可能なNPMモジュールを定義します。入力するデータの多くは、(2)のモジュールプロパティ編集タブで指定したものと同じですので、将来的にはツールにより自動生成されることが期待されます。

{
  "name": "node-red-contrib-grep",
  "version": "0.1.0",
  "description": "Node-RED node for extracting matching lines",
  "node-red": {
      "nodes": {
          "grep": "subflow.js"
      }
  },
  "keywords": [
    "node-red",
    "grep",
    "regular-expression"
  ],
  "author": "hiroyasu.nishiyama.uq@hitachi.com",
  "license": "Apache-2.0"
}

5. ノードの説明

説明をMarkdown形式で記載したREADME.mdファイルを作成します。

6. ライセンス条件

再配布を行う場合のライセンス条件を定義したLICENSEファイルを作成します。一般的に利用されるライセンスを選択した場合は、その条項を記載します。

7. Javascriptテンプレートコード

サブフローの読み込みを行う、JavaScriptファイル(subflow.js)を作成します。このファイルは全てのサブフローモジュールで共通して利用できます。なお、このコードではサブフローを含むサブフローには対応していません。

 const fs = require("fs");
 const path = require("path");

 module.exports = function(RED) {
     const subflowFile = path.join(__dirname,"subflow.json");
     const subflowContents = fs.readFileSync(subflowFile);
     const subflowJSON = JSON.parse(subflowContents);
     const sf = subflowJSON.shift();
     sf.flow = subflowJSON;
     RED.nodes.registerSubflow(sf);
 }

8. サブフローのJSONデータ作成

サブフローテンレートの編集タブを開き、「書き出し」メニューから現在のタブを選択、ダウンロードボタンによりJSON形式のサブフローデータをダウンロード。作業ディレクトリにsubflow.jsonという名前でコピーします。

9. npm pack

npm packを実行し再配布ファイルを作成します。

% npm pack
npm notice
npm notice 📦  node-red-contrib-grep@0.1.0
npm notice === Tarball Contents ===
npm notice 0B    LICENSE
npm notice 0B    README.md
npm notice 376B  package.json
npm notice 401B  subflow.js
npm notice 1.4kB subflow.json
npm notice === Tarball Details ===
npm notice name:          node-red-contrib-grep
npm notice version:       0.1.0
npm notice filename:      node-red-contrib-grep-0.1.0.tgz
npm notice package size:  1.3 kB
npm notice unpacked size: 2.2 kB
npm notice shasum:        71f9d9380a23f308b5d677447598413266720efa
npm notice integrity:     sha512-P/B6Qdi0u3/dV[...]Zr9NyOnkR157A==
npm notice total files:   5
npm notice
node-red-contrib-grep-0.1.0.tgz
%

node-red-contrib-grep-0.1.0.tgzという再配布ファイルが作成されます。

10. Node-REDへのアップロード

エディタの「パレットの管理」メニュー、「ノードを追加」タブ、からアップロードボタンをクリックします。

先程作成したnode-red-contrib-grep-0.1.0.tgzを選択しアップロードします。パレットに作成したノードが追加されます。

追加したノードはサブフローテンプレートの編集はできず、通常のノードとほぼ同様に扱うことが可能です。

おわりに

Node-RED 1.3で実装されたサブフローのノード化機能によって、HTMLやJavaScriptでのコーディングを行うことなくNode-REDのエディタでのフロー作成だけで再配布可能なノードを作ることが可能となりました。

この機能によりノードの作成の手間を大きく削減できるため、別の記事で紹介したFunctionノードの外部ライブラリ利用機能と合わせて、再利用可能なノード開発が活性化することを期待しています。

Node-RED1.3の新機能紹介

Node-RED: Node-REDは，OpenJS Foundationの米国およびその他の国における登録商標または商標である。
JavaScript: JavaScriptは、Oracleの米国およびその他の国における登録商標または商標である。

You get articles that match your needs
You can efficiently read back useful information
You can use dark theme

What you can do with signing up