LoginSignup
9
4

More than 3 years have passed since last update.

@satosiyonezawa(satosi yonezawa)

enebularでGoogleカレンダーの予定の時間がきたらフローを開始する

Last updated at Posted at 2019-09-24

フリーランスエンジニアのよねざわ(@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

  • ノードがインストールされました
    スクリーンショット 2019-09-21 16.19.53.png

  • カレンダー(input)ノードをドラッグアンドドロップで設置します。
    スクリーンショット 2019-09-21 16.41.54.png

  • ノードをダブルクリックして連携したいGoogleカレンダーの認証情報の入力画面を開きますスクリーンショット 2019-09-21 16.56.47.png

  • 以下の３つの項目が出てきました。次の章で詳しく解説します。

    • リダイレクトURI
    • クライアントID
    • シークレットキー スクリーンショット 2019-09-21 17.00.59.png

GCPのプロジェクトを作成

enebularとGoogleカレンダーを連携するために
Google側でリダイレクトURIの設定と
クライアントIDとシークレットキーの発行が必要になります。

  • Googleの開発者コンソールにアクセスしましょう
  • はじめてGCPを使うアカウントは以下の画面が出てくると思うのでチェックをして 同意して続行 を押します

  • 本記事ではAPIの有効化をして認証情報を作成するだけなのでGCPの料金は発生しません。決済情報の入力も必要ありません。
    スクリーンショット 2019-09-21 17.28.43.png

  • プロジェクトを作成します。上の 組織なし をクリック
    スクリーンショット 2019-09-21 18.12.18.png

  • プロジェクトを作成 をクリック
    スクリーンショット 2019-09-21 18.12.45.png

  • プロジェクト名に任意の名前を入力

  • 任意の場所を指定

  • 作成ボタンをクリック
    スクリーンショット 2019-09-21 18.14.04.png

Google+とGoogleカレンダーのAPIを有効にする

  • ダッシュボードの APIとサービスを有効化 をクリック
    スクリーンショット 2019-09-21 18.15.47.png

  • [google plus]で検索

スクリーンショット 2019-09-21 18.16.29.png

  • Google+ API をクリック

スクリーンショット 2019-09-21 18.17.51.png

  • 有効にする ボタンをクリック

スクリーンショット 2019-09-21 18.18.28.png

  • 同様にGoogleカレンダーのAPIを有効にします スクリーンショット 2019-09-21 21.20.40.png スクリーンショット 2019-09-21 21.21.24.png

認証情報を作成

  • GoogleAPIsのダッシュボードから 認証情報 をクリック
  • 認証情報を作成 をクリック

  • OAuthクライアントID をクリック
    スクリーンショット 2019-09-21 18.40.01.png

  • enebularからGoogleと連携するときに開く同意画面について設定します
    スクリーンショット 2019-09-21 18.54.52.png

  • アプリケーション名 に任意の名前を入力
    スクリーンショット 2019-09-21 18.56.40.png

  • 承認済みドメイン にURIのドメインを入力→Enter→保存ボタンをクリック

    • カレンダーノードをダブルクリックしたときに表示される赤文字のドメイン
    • 入力例：ev2-prod-node-red-XXXXXXXX-XXX.herokuapp.com スクリーンショット 2019-09-21 19.20.27.png スクリーンショット 2019-09-21 19.10.00.png

  • 認証情報を設定します

    • アプリケーションの種類
      • ウェブアプリケーション
    • 名前
      • 任意の名前
    • 承認済みの JavaScript生成元
      • 空欄
    • 承認済みのリダイレクト URI
      • ノード側の赤文字のURIをコピペ(https://からcallbackまで全て)
    • 作成ボタンを押す

スクリーンショット 2019-09-21 19.38.58.png

  • 出現したクライアントIDとクライアントシークレットをノード側の認証情報にコピペ スクリーンショット 2019-09-21 19.48.23.png
  • ノードの Authenticate with Googleボタン をクリック スクリーンショット 2019-09-21 19.51.08.png

このアプリは確認されていません という画面が出てきますが以下を実行します。

  • 詳細ボタン

  • ev2-prod-node-red-XXXXXX-XXX.herokuapp.com（安全ではないページ）に移動
    スクリーンショット 2019-09-21 19.57.20.png

  • 許可→チェック→許可

  • 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
スクリーンショット 2019-09-21 20.45.24.png
スクリーンショット 2019-09-21 20.52.54.png

  • ノード側に戻って追加ボタンをクリック
    スクリーンショット 2019-09-21 20.56.39.png

  • 画像の設定例ではカレンダーのイベントが始まった時にフローが開始します
    スクリーンショット 2019-09-21 20.57.39.png

  • debugノードを設置してカレンダーノードとつないでデプロイボタンをクリック
    スクリーンショット 2019-09-21 21.05.59.png

カレンダーを作成して連携確認

まとめ

enebularとGoogleカレンダー連携をさせることができました。
enebular側の作業はわずかでGoogle側の設定がほとんどでしたね。

  • カレンダーの情報も取得できるのでカレンダードリブンのシステム連携ができそう
  • カレンダーAPIの他にもGoogle+APIの許可が必要（ノードの仕様のため？）
  • OAuth認証は認証画面を挟んでいる分、設定がちょっとめんどう
9
4
11

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
9
4