フリーランスエンジニアのよねざわ(@satosiyonezawa)です。
Node-REDでGoogleカレンダー連携をしている情報があまりなかったので
今回は enebular を使って
Googleカレンダーの予定時間になったら
enebularのフロー(処理)を開始するということをやってみます。
#準備
- enebularの導入はこちら
- Introduction(公式)
- ↑から無料でアカウントを作ってHelloWorldの実行まですぐにできます
- 連携したいカレンダーのGoogleアカウントにログインしてください
#Googleノードをインストール
Googleカレンダーと連携できるノードをインストールします
-
node-red-node-googleノード をインストール
- 右上の adminタブ をクリック
- node-red-node-google と入力
- Installボタン をクリック
![スクリーンショット 2019-09-21 16.07.26.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F42c1fd05-6ca6-262f-61ec-870c72a857d5.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=00a73984115862cd3c7aabab10fd45cb)
- ノードがインストールされました
![スクリーンショット 2019-09-21 16.19.53.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fa1e0221f-5de2-f117-6f24-0e42034d2f3c.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=c9506b7902f5fb51d3ea5d83f6e36598)
- カレンダー(input)ノードをドラッグアンドドロップで設置します。
![スクリーンショット 2019-09-21 16.41.54.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F1ec20f51-056a-bbb6-f19e-104f11782386.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=21cfe33a5fa5a95b291ec5866f62d95a)
-
以下の3つの項目が出てきました。次の章で詳しく解説します。
- リダイレクトURI
- クライアントID
- シークレットキー
![スクリーンショット 2019-09-21 17.00.59.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fea948334-c362-95ea-c64e-78636a9143b3.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=5656ce646ab9b34677c9932ba8c72ce7)
#GCPのプロジェクトを作成
enebularとGoogleカレンダーを連携するために
Google側でリダイレクトURIの設定と
クライアントIDとシークレットキーの発行が必要になります。
- Googleの開発者コンソールにアクセスしましょう
- はじめてGCPを使うアカウントは以下の画面が出てくると思うのでチェックをして 同意して続行 を押します
- 本記事ではAPIの有効化をして認証情報を作成するだけなのでGCPの料金は発生しません。決済情報の入力も必要ありません。
![スクリーンショット 2019-09-21 17.28.43.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F56d1f794-453e-cbea-e24b-982b6aae5746.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=c179543360e612ab18187f71e8a04efa)
- プロジェクトを作成します。上の 組織なし をクリック
![スクリーンショット 2019-09-21 18.12.18.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F23f274ba-c661-b562-6cee-9f65dd5e806e.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=888b42519bd5f1b6009dd5cf4da66a2c)
- プロジェクトを作成 をクリック
![スクリーンショット 2019-09-21 18.12.45.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F8356afd4-8344-961c-1469-cb80cdf9c95d.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=3ac9af33cfb36859ec87bd500e0be319)
- プロジェクト名に任意の名前を入力
- 任意の場所を指定
- 作成ボタンをクリック
![スクリーンショット 2019-09-21 18.14.04.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fa9303eb9-d70a-c63d-ef9f-69c0c5e63553.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=b288a97c3154aff88df7f9688c5682e0)
#Google+とGoogleカレンダーのAPIを有効にする
- ダッシュボードの APIとサービスを有効化 をクリック
![スクリーンショット 2019-09-21 18.15.47.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fdbb8f6c9-5222-bc7d-ac87-1e20aef3a3a9.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=005ac845e461e7eafab37d5b3ffeb937)
- [google plus]で検索
![スクリーンショット 2019-09-21 18.16.29.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Ff10a8c22-64c1-6cfe-caa4-332c79712a2a.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=d1a64ec6206ae087b162993c66dfecbe)
- Google+ API をクリック
![スクリーンショット 2019-09-21 18.17.51.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F1f33f73f-be7e-53b3-6f7f-10172b3b5160.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=9f406776b7f7e23072ba5cf3428e31fc)
- 有効にする ボタンをクリック
![スクリーンショット 2019-09-21 18.18.28.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F67f58736-dd79-5661-2227-63560b8dd43c.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=d4588749c0d7496a4d12a472586a506f)
- 同様にGoogleカレンダーのAPIを有効にします
![スクリーンショット 2019-09-21 21.20.40.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F20538cf8-11cc-1668-47b6-dfef21a4807c.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=d2103213c71f991b373ea9cc5093c40f)
![スクリーンショット 2019-09-21 21.21.24.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fd8151b07-a104-0176-19d0-2a1df0dd7c19.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=3842fda89cf499275cd4d3ccc4d27946)
#認証情報を作成
- GoogleAPIsのダッシュボードから 認証情報 をクリック
- 認証情報を作成 をクリック
- OAuthクライアントID をクリック
![スクリーンショット 2019-09-21 18.40.01.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Feaf36fdb-7f47-d414-1dc7-2da0ca37fd9a.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=bc3b487c3a86625bb799d0c9bfda4281)
- enebularからGoogleと連携するときに開く同意画面について設定します
![スクリーンショット 2019-09-21 18.54.52.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F3f74fd47-849c-df46-c5f3-82b81872370a.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=413756de14f4bdf5545eb2648fe7c7dc)
![スクリーンショット 2019-09-21 18.56.40.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fddf5f587-730e-5be9-8bff-a7cc07432dbb.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=ba7402fde5454badc48d593b42caf54a)
-
承認済みドメイン にURIのドメインを入力→Enter→保存ボタンをクリック
- カレンダーノードをダブルクリックしたときに表示される赤文字のドメイン
- 入力例:ev2-prod-node-red-XXXXXXXX-XXX.herokuapp.com
![スクリーンショット 2019-09-21 19.20.27.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fd8c30268-f7cc-72da-ab88-fd4c7a8b6a34.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=df8c85cdc1e8a374e03134f39e67855f)
![スクリーンショット 2019-09-21 19.10.00.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fee059c9b-0c8c-52bf-6e66-8106726d577d.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=e485d4f295ed0bcb3642ce4837654a84)
- 認証情報を設定します
- アプリケーションの種類
- ウェブアプリケーション
- 名前
- 任意の名前
- 承認済みの JavaScript生成元
- 空欄
- 承認済みのリダイレクト URI
- ノード側の赤文字のURIをコピペ(https://からcallbackまで全て)
- 作成ボタンを押す
- アプリケーションの種類
![スクリーンショット 2019-09-21 19.38.58.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F0fbf960b-3953-87fe-872f-edf1c1968a30.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=de11674d2dac66204588e6799c64faa9)
- 出現したクライアントIDとクライアントシークレットをノード側の認証情報にコピペ
![スクリーンショット 2019-09-21 19.48.23.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F0ffe1d60-86d2-e259-815c-60ec0b7749b6.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=91cac47e10c381b8042fe2cc80f3601d)
![スクリーンショット 2019-09-21 19.51.08.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F736a1b05-04b2-657f-dd2b-f1d7fced288b.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=0f084f65933e7d058d5da5badcc7b99c)
このアプリは確認されていません という画面が出てきますが以下を実行します。
- 詳細ボタン
- ev2-prod-node-red-XXXXXX-XXX.herokuapp.com(安全ではないページ)に移動
![スクリーンショット 2019-09-21 19.57.20.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F67c1d44d-fb9e-afbb-78b0-c62ea409ae5c.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=66635cd800d1636340c4018350b12ac7)
- 許可→チェック→許可
Authorised - you can close this window and return to Node-RED と表示されれば連携成功
2020年1月2日追記
現在はここで失敗してしまいます。記事公開時は上記メッセージが出ていたのですが、連携できないとの指摘があり再現しました。
エラーメッセージ「auth worked but profile fetching failed」
GoogleAPI側の問題だと思いますが解決した方は教えていただければ幸いです。
↑2020年9月16日現在、問題無しとの報告いただきました!
![スクリーンショット 2019-09-21 20.44.36.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fde5296dd-72f0-8c22-3dd9-9ee47e08faf8.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=45d7c5a0bf6f4aa0061d056e979c8564)
![スクリーンショット 2019-09-21 20.45.24.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F9e438159-b96a-6fcb-effe-18fda6fe22c3.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=ca546b9bb3c9e8ddd9bc2f690131b2a3)
![スクリーンショット 2019-09-21 20.52.54.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Fcf772a4e-4266-bd08-5b84-b62652bfe026.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=e06b2acfa5c25b83cbc5d085a889ab2d)
- ノード側に戻って追加ボタンをクリック
![スクリーンショット 2019-09-21 20.56.39.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F35f31bf1-8a93-b762-72dc-3f5facc4fc06.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=cefe11769bc959b0eb2e79cc0fcca26a)
- 画像の設定例ではカレンダーのイベントが始まった時にフローが開始します
![スクリーンショット 2019-09-21 20.57.39.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Ff24b53ca-99f6-7a88-06e8-f7434660da77.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=4d497524fc265cf68d2aa3da4b75614e)
- debugノードを設置してカレンダーノードとつないでデプロイボタンをクリック
![スクリーンショット 2019-09-21 21.05.59.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2Ff3cf493b-0579-5708-1c04-eae84a1bc3ac.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=fdc420f72829945e77da77a2ac26ab21)
#カレンダーを作成して連携確認
- 予定を作成します
![スクリーンショット 2019-09-21 21.26.53.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F35d84706-a860-d02f-da9b-1c8a8c75cb82.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=948dd1933bb6b576a06f101fba7d4b2a)
- 予定の開始時間が来たらフローが開始します
![スクリーンショット 2019-09-21 21.25.26.png](https://qiita-user-contents.imgix.net/https%3A%2F%2Fqiita-image-store.s3.ap-northeast-1.amazonaws.com%2F0%2F270185%2F7f214bbc-2bf7-d032-672c-1c4033abdef9.png?ixlib=rb-4.0.0&auto=format&gif-q=60&q=75&s=0246288792e86d98abe57d96335c17b2)
- カレンダーの情報も取得しています。詳しくはノードの公式ページを参照
#まとめ
enebularとGoogleカレンダー連携をさせることができました。
enebular側の作業はわずかでGoogle側の設定がほとんどでしたね。
- カレンダーの情報も取得できるのでカレンダードリブンのシステム連携ができそう
- カレンダーAPIの他にもGoogle+APIの許可が必要(ノードの仕様のため?)
- OAuth認証は認証画面を挟んでいる分、設定がちょっとめんどう