しました。
tl;dr
こちらです。
- If this node is triggered, this node will take a screenshot of the configured web page in setting screen.
- This node takes a screenshot as PNG image, and encodes with base64.
- The base64 string will be returned.
これはどんなノード？
予め設定したWebページのスクリーンショットを撮影して、そのスクリーンショット（PNG）をBase64でエンコードして次のノードに渡すものです。
たとえば、こんな感じで使います。
[{"id":"67c61941.053d58","type":"tab","label":"Flow 1","disabled":false,"info":""},{"id":"2660a5a5.ba220a","type":"http in","z":"67c61941.053d58","name":"","url":"/test","method":"get","upload":false,"swaggerDoc":"","x":180,"y":140,"wires":[["2fe6f48.ec2f80c"]]},{"id":"2fe6f48.ec2f80c","type":"screenshot","z":"67c61941.053d58","name":"","url":"https://relativelayout.hatenablog.com/","x":300,"y":200,"wires":[["86463a3a.b78058"]]},{"id":"86463a3a.b78058","type":"template","z":"67c61941.053d58","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"<html>\n <body>\n <img src=\"data:image/png;base64,{{payload}}\">\n </body>\n</html>","output":"str","x":420,"y":260,"wires":[["769165e4.dc545c"]]},{"id":"769165e4.dc545c","type":"http response","z":"67c61941.053d58","name":"","statusCode":"","headers":{},"x":520,"y":320,"wires":[]}]
スクリーンショットノードで取得できるBase64の文字列を、次のテンプレートノードでHTMLページに埋め込んでいます。
<html><body><img src=\"data:image/png;base64,{{payload}}\"></body></html>
こんな感じで作ったフローにアクセスしてみると・・・
スクリーンショットが、ちゃんとページに埋め込まれてますね。
どうやって動いてるの？
ノードの内部では、ヘッドレスChromeをいい感じにこねくり回してくれるPuppeteerを使っています。
Node.jsのライブラリで、認証をパスできたり、DOMを操作できたり、Seleniumみたいにいろいろできる神ライブラリです。もりもり使いたい人は、本家ライブラリも合わせてご利用下さいませ。
今後の予定
以下の機能を中心にアップデートを予定しています。
他にも、欲しい機能があればIssuesとかにコメントください。（対応するとは言っていない）
既知の不具合
いくつかの既知の不具合が存在します。
ARMで動かない話
対応しました！
0.0.4以降では、Headlessモードに対応したChromiumを別途インストールし、そのパスをノードの設定画面で指定すれば動作するようになりました。
動きません。
Puppeteerの依存関係にあるChromiumですが、x86用でARMようではなく、Puppeteerもデフォルトでそれを使うようになってます。コンストラクタでARM用のChromiumを指定してあげればいいんですが、現状のノードではその機能は入っていません。
ARMで使えない、ということはRaspberry Piでも使えないということになります・・・。本当にごめんなさい。おいおい対応します。
herokuで動かない話
ちょっと闇が多すぎ・・・。
詳しくは、上記リンクを御覧ください（真顔）
- メディア: おもちゃ＆ホビー
