サブフローからenebular向けのプライベートノードをつくる手順

今回はサブフローから、enebular用のプライベートノードをつくる手順を紹介します。この方法を用いると、コマンド操作不要でブラウザのみでプライベートノードを開発できます。

本記事では、例として牛のアスキーアートを表示するcowsayノードをつくってみます。

1. いつも通りフローを作成

最初に、フローを最初から作成する必要があります。 フローエディタのワークスペースにfunctionノードを配置した後、「コード」タブ内のテキスト領域に次のコードを貼り付けます。

msg.payload = cowsay2.say(String(msg.payload));
return msg;

cowsay2モジュールを読み込むには、functionノードの「設定」タブを開き、左下の「+追加」ボタンをクリックした後、モジュール名の入力欄にcowsay2を入力します。

functionノードの前後に、injectノード(フローでは「タイムスタンプ」という名前)とdebugノードを接続してフローを完成させます。injectノードのプロパティ設定では、msg.payloadの欄の型を「日時」から「文字列」へ変更し、「Hello! enebular!」を設定しました。フローを実行する前に、右上の保存ボタンをクリックして、フローをバックエンドにデプロイします。

右側の虫アイコンが付いているデバッグタブを表示させた後、「Hello! enebular!」と書かれたinjectノードの左側のボタンをクリックすると、デバッグタブに牛のASCIIアートが表示されます。

2. フローをサブフローに変換

次に、定義されたフローから新しいサブフローを作成しましょう。サブフローに変換するfunctionノードを選択した後、右上にある三本線の「メニュー」->「サブフロー」->「選択部分をサブフロー化」を選択します（今回の場合、対象のフローはfunctionノードのみです。そのため、functionノードのみを選択しました。もちろん、3つ以上のノードを対象とする場合は、サブフローにする必要がある複数のノードを選択する必要があります。）

この操作をすると、選択したfunctionノードがサブフローに変更されます。

ダブルクリックしてサブフローを開くと、サブフローのノードプロパティが表示されます。 このノードプロパティには、「サブフローのテンプレートを編集」ボタンがあり、内部のフローを参照して、プライベートノードに関連するいくつかの設定を入力できます。

厳密には、前の「選択部分をサブフロー化」の操作では、functionノードがサブフロー内に移動されています。 そのため「サブフローのテンプレートを編集」ボタンをクリックすると、元のfunctionノードが表示されます。

次の手順として、フローエディタの左上にある「プロパティを編集」のボタンをクリックします。

3. ノードモジュールの情報を入力

functionノードの「名前」フィールドに、サブフロー名として使用する「cowsay」を入力します。この名前は、最終的に、生成されたプライベートノードの名前として使用されます。

ノードモジュール情報を設定するには、中止ボタンと完了ボタンの下にある立方体アイコンをクリックします。 立方体アイコンをクリックして開いた「モジュールのプロパティ」タブで、プライベートノードの情報を指定します。これらの情報は、プライベートノードのpackage.jsonファイルで使用されます。

enebular用のプライペートノードを作成する際は、モジュール名のプレフィックスとして「enebular-privatenode-contrib-」を入力する必要があります。 たとえば、「enebular-privatenode-contrib-cowsay」と入力します。

次の表は、入力の例です。

フィールド	入力値
モジュール	enebular-privatenode-contrib-cowsay
ノードの型	cowsay
バージョン	4.5.1
説明	A node to generate ascii art using cowsay module
ライセンス	Apache-2.0
作者	Kazuhito Yokoi <[e-mail]>
キーワード	enebular,cowsay

4. サブフローをJSONファイルとして書き出し

サブフローデータをローカルPCにダウンロードするには、まず中央のワークスペースでサブフローを選択します。 次に、フローエディタのメニューから「書き出し」を選択します。

次に、「フローを書き出し」ダイアログにある「ダウンロード」ボタンをクリックします。

ボタンを押すと、ブラウザは自動的に「flows.json」ファイルを「Downloads」フォルダにダウンロードします。

5. GitHubリポジトリにテンプレートを読み込み

このステップでは、「flows.json」ファイルを保存するためのGitHubリポジトリを準備します。 GitHubのURL（ https://github.com/new/import ）にアクセスすると、既存のリポジトリをインポートするための次のページが表示されます。

「Your old repository’s clone URL」のフィールドに、「 https://github.com/kazuhitoyokoi/node-red-contrib-template.git 」と入力します。このリポジトリには、サブフローからプライベートノードを自動的に構築するためのGitHub Actionsスクリプトが含まれています。「Repository Name」の欄に、リポジトリ名としてノードモジュール名を入力します。これは、サブフローのノードプロパティで指定したモジュール名と同じ(今回は「enebular-privatenode-contrib-cowsay」)である必要があります。最後にPrivacyとしてPrivateを選択し「Begin import」ボタンをクリックして、インポート処理を実行します。

インポート処理が成功すると、次のメッセージが表示されます。

上記のスクリーンショットの例では、「kazuhitoyokoi/enebular-privatenode-contrib-cowsay」のリンクから作成したGitHubリポジトリに移動できます。

次にリポジトリ内にあるGitHub Actionsのスクリプトファイル「.github/workflows/release.yml」に移動し、鉛筆ボタンをクリックして編集画面を開きます。

ここでenebular用のプライベートノードを生成できるように「node-red-contrib-」となっている部分を「enebular-privatenode-contrib-」に書き換えます。

6. JSONファイルをGitHubリポジトリにアップロード

インポートしたリポジトリでは、ブラウザの操作でflows.jsonファイルをアップロードできます。次のスクリーンショットに示すように、最初に「Add file」ボタンをクリックしてから、プルダウンメニューで「Upload files」を選択します。

次の画面で、flows.jsonファイルを中央の領域にドラッグするか、「choose your files」のリンクからファイルをアップロードします。 flows.jsonファイルをアップロードした後、「Commit changes」ボタンをクリックして、アップロードされたファイルをバージョン管理システムに記録します。

これらの操作の後は、アップロードされたflows.jsonファイルが、「.github/workflows」ディレクトリおよび「README.md」ファイルとともにGitHubリポジトリに表示されます。

7. リポジトリ設定を変更

インポートしたリポジトリでは、GitHub Actionsはデフォルトで無効になっています。したがって、GitHub Actionsを有効にして、権限も変更する必要があります。設定を変更するには、歯車のアイコンが付いた「Settings」をクリックします。Settingsのページに移動すると、最初にGeneral設定が表示されます。 GitHub Actionの構成に移動するには、左側のメニューに再生ボタンがある「Actions」を開き、「General」を選択します。

上記は設定変更後のスクリーンショットです。このスクリーンショットからわかるように、権限設定を変更する必要があります。まず、「Actions permissions」セクションにある「Disable Actions」を「Allow all actions and reusable workflows (すべてのアクションと再利用可能なワークフローを許可する)」にラジオボタンを切り替えます。その後、「Save」ボタンをクリックして変更を適用します。

8. プライベートノードの生成

次のステップでは、GitHub Releasesの機能を使用してプライペートノードをリリースします。左側にある「Code」メニューからGitHubリポジトリのトップページに移動します。

トップページの右下の「Releases」エリアに「Create a new release」というリンクがあります。このリンクをクリックすると、リポジトリのリリースページに移動できます。

リリースのタグを作成するには、「Choose a tag」をクリックし、「v4.5.1」と入力した後、「+ Create new tag: v4.5.1 on publish」をクリックします。

リリースのタイトルには、たとえば「v4.5.1: The First Release」のような説明を入力します。 最後に、「Publish release」ボタンを押します。

リリース手順の後、ブラウザに次のページが表示されます。 リリース直後は、Assetsのファイルリストには最初にzipとtar.gzの2つのソースコードファイルしかありません。 しかし、しばらくすると1分以内にプライベートノードを含むtgzファイル「enebular-privatenode-contrib-cowsay-4.5.1.tgz」が追加されます。 プライベートノードの生成の進行状況を知りたい場合は、再生アイコンのある「Actions」ボタンからGitHub Actionsのページで処理のログを確認できます。

tgzファイルをローカルPCにダウンロードするには、「enebular-privatenode-contrib-cowsay-4.5.1.tgz」のリンクをクリックします。

9. プライベートノードをenebularにインポート

生成したプライベートノードのtgzファイルをenebularのプライベートノード機能を用いてフローエディタにインストールします。

上記ダイアログからtgzファイルをアップロードした後、フローエディタをリロードすると矢印アイコンの付いた新しいcowsayノードがパレットの機能カテゴリに表示されます。

もちろん、生成されたノードは元のサブフローと同じように動作します。フローを作成してみましょう。牛が「Hello! enebular!」と喋ってくれました。

※本記事は、ノードをつくるハンズオンのコンテンツをenebularのプライベートノード向けに書き換えて作成しました。