Node-RED でカスタムノードを作ってみよう

前回の関連記事

カスタムノードを実装してみます！

カスタムノードの作り方

nodered.jp

[必要なもの]

• package.json
• .js
• .html

用意してみた

$ tree hello-node/
hello-node/
├── greet.html
├── greet.js
└── package.json

package.json の中身

$ cat package.json 
{
  "name": "greet-node",
  "version": "1.0.0",
  "node-red": {
    "nodes": {
      "greet": "greet.js"
    }
  }
}

greet.html

<script type="text/javascript">
    RED.nodes.registerType('greet',{
        category: 'My Node',
        color: '#a6bbcf',
        defaults: {
            name: {value:""},
            firstName: {value:""},
            familyName: {value:""}
        },
        inputs:1,
        outputs:1,
        icon: "file.png",
        label: function() {
            return this.name || "greet";
        }
    });
</script>

<script type="text/html" data-template-name="greet">
    <div class="form-row">
        <label for="node-input-name"><i class="icon-tag"></i> Name</label>
        <input type="text" id="node-input-name" placeholder="Name">
    </div>
    <div class="form-row">
        <label for="node-input-firstName"><i class="icon-user"></i> First Name</label>
        <input type="text" id="node-input-firstName" placeholder="First Name">
    </div>
    <div class="form-row">
        <label for="node-input-familyName"><i class="icon-user"></i> Family Name</label>
        <input type="text" id="node-input-familyName" placeholder="Family Name">
    </div>
</script>

<script type="text/html" data-help-name="greet">
    <p>A node that greets a person using their first name and family name.</p>
</script>

greet.js

$ cat greet.js 
module.exports = function (RED) {
  function greetNode(config) {
    RED.nodes.createNode(this, config);
    var node = this;
    node.on("input", function (msg) {
      const { firstName, familyName } = config;
      msg.payload = `Hi ${firstName} ${familyName}!`;
      node.send(msg);
    });
  }
  RED.nodes.registerType("greet", greetNode);
};

Node-RED にインストールする

Node-RED のディレクトリに移動して以下のコマンドを入力します。

$ npm link path/to/hello-node

そして Node-RED を再起動します。

確認！

greet ノードが生まれました

greet.html 内に記述してある説明文

greet.html 内に記述してある設定フォーム

実際に使ってみる

自作の greet ノードを使った API

設定値はこんな感じ

デプロイして curl でリクエストする

$ curl http://localhost:1880/hello
Hi zako lab929!

URL Query で柔軟に名前を設定できるようにしてみる

module.exports = function (RED) {
  function greetNode(config) {
    RED.nodes.createNode(this, config);
    var node = this;
    node.on("input", function (msg) {
      const firstName = msg.payload.firstName || config.firstName;
      const familyName = msg.payload.familyName || config.familyName;
      msg.payload = `Hi ${firstName} ${familyName}!`;
      node.send(msg);
    });
  }
  RED.nodes.registerType("greet", greetNode);
};

config より優先して msg.payload を使うようにしました
Node-RED の再起動を忘れないように...!!

function ノードを増やして greet に繋げた様子

greet に繋げる function ノードの様子

デプロイして curl でリクエストする

$ curl "http://localhost:1880/hello?firstName=foo&familyName=bar"
Hi foo bar!

いい感じです

まとめ

かなり簡単にノードが実装できました