カテゴリー内の他の記事

Google Home連携でタスク登録 & 確認をしてみよう!

フォローする

(著者:サイボウズ 三宅 智子)

 [kintone環境をお持ちでない方へ]developer network(当サイト) のメンバー登録をした後、1年間無料の開発者向けライセンスを使えます。

Index

概要

皆さんこんにちは!価格もお手軽なスマートスピーカーということで人気のGoogle Home
今回はkintoneと連携してタスク登録と今日締め切りのタスク確認をします。
工夫すると色んなパターンの会話を作ることができますが、ここでは基本的な作り方を解説するためにシンプルな例でご紹介したいと思います。

※Node.jsでのコーディングを含みます。

シナリオ

大まかなシナリオは、以下の2つです。

  • タスク登録
  • 今日締切のタスク確認

____.png

Actions on googleとは

Google Assistant用のアプリケーションを作成するためのプラットフォームです。
Google Assistantに独自のサービスを追加したり、Google Homeと会話するためのアプリケーションを作成したりすることができます。
また、細かい会話ロジックの作成は、Dialogflow/Smart home/Actions SDK/Converse.AIのいずれかを選択して行います。
Converse AIは日本語での対話に対応していないので、ご注意ください。
詳細はこちらをご確認ください。

Dialogflowとは

自然言語の対話プラットフォームです。Google Assistant上で、シンプルな会話ロジックを作成するためのアプリケーションです。
因みにGoogle Assistant以外でのロジック作成にも使うことが可能です。また、Webhookも利用することができます。
詳細はこちらをご確認ください。

Firebaseとは

MBaas(Mobile Backend as a Service)と呼ばれるクラウドデータベースサービスです。
今回はDialogflow内でのスクリプト置き場 & 実行環境として利用しています。
まだβ版な点に注意してご利用ください。

  • 公式サイト
  • 料金体系
    ※ 今回はFirebaseのCloud Functionsを利用します。Google関連以外のAPIリクエストをする場合は、
    無料のSparkプランでは対応していないので、FlameやBlazeプランにアップグレードする必要があります。(FlameやBlazeプランでも、無料で使える枠はあります)

完成イメージ

諸々の設定が完了してGoogle Homeに話しかけてみると、以下のようなやり取りができるようになります。
Actions on GoogleのSimulatorで実行しています。(正式なアプリとしては公開していません)

会話の流れ

会話の詳細な流れは以下になります。タスク追加や今日締切のタスク取得のところで、kintoneへHTTP Requestをしています。

 

手順概要

Google Home連携には各サービスでいくつか細かい設定が必要になります。今回は以下の順番で設定を行います。

_____.png

  1. kintoneでのアプリ作成
  2. Google Homeアプリのインストールと設定
  3. Actions on Googleの設定
  4. Dialogflowの設定

事前に準備するもの

  • kintone環境
  • Googleアカウント
  • Firebase FlameやBlazeプラン(FreeプランだとkintoneへのHTTP Requestができません)
    ※ クレジットカードの登録が必要、かつ利用量によっては料金が発生するので、ご利用の際はご注意ください。

kintoneのアプリ作成

タスクを登録 & 確認するためのkintoneアプリを作成します。

  1. kintoneにログイン後、アプリストアから「To Do」アプリの追加を行います。アプリの追加方法はこちらをご参照ください。
  2. 追加したアプリ内で以下のフィールド名とフィールドコードが存在することを確認してください。
     フィールドタイプ  フィールド名  フィールドコード
    日付 締切日 Duedate
    文字列(1行) ToDo名 To_Do
  3. アプリIDをメモしておいてください。後ほどコード内で指定します。
    例)https://{subdomain}.cybozu.com/k/xxx/ ←アプリIDはxxxの部分の数字です。
  4. APIトークンを生成してください。アクセス権は、「レコード閲覧」と「レコード追加」にチェックを入れます。こちらも後ほどコード内で指定するので、メモしておいてください。
    APIトークンの生成方法は、こちらをご参照ください。 

    1.png

これにてkintoneの設定は完了です。

Google Home アプリのインストールと設定

次は、Google Homeを使うための初期設定です。

  1. 電源ケーブルをGoogle Homeに差し込みます
  2. 電源アダプターをコンセントに差し込みます
  3. スマートフォンやタブレットでGoogle Homeアプリをダウンロードして実行します

公式サイトやレビューサイトにも手順が載っているので、参考にしながら進めてください。

※ アプリで言語設定を日本語に変更するのを忘れないようにしてください。

Actions on Googleの設定

続いて、Google Assistant用のアプリケーションを作成します。
基本英語ドキュメントしかないのですが、日本語訳されている方がいるので、こちらのサイトを私は活用させていただきました!

  1. Actions on Googleの設定の前に、利用するGoogleアカウントでGoogle Homeを利用するための設定を1つ行います。
    Googleアカウントのアクティビティ管理サイトにアクセスして、以下の項目を有効にしてください。
    ・ウェブとアプリのアクティビティ(その下のチェックボックスにもチェックを入れる)
    ・音声アクティビティ
  2. Actions on Googleのサイトにアクセスします。
  3. Googleアカウントにログインしていない場合は、Google Homeと紐付けたGoogleアカウントでログインします。
  4. 「ACTIONS CONSOLE」ボタンをクリックします。

    3.png

  5. 新規にプロジェクトを作成するので「Add/ import project」をクリックします。
    右上の赤枠のアイコンを見て、別のGoogleアカウントにログインされている場合は、アイコンをクリックしてアカウントを切り替えてください。

    4.png

  6. 「Project name」と「Country/region」をそれぞれ以下に設定して、「CREATE PROJECT」ボタンをクリックします。

    5.png

  7. Overviewの画面に遷移するので、会話ロジック作成に利用する「Dialogflow」のボックス右下の「BUILD」をクリックします。

    6.png

  8. 「CREATE ACTIONS ON DIALOGFLOW」ボタンをクリックして、Dialogflowの画面に移動します。

    7.png

Dialogflowの設定

Actions on GoogleからDialogflowアカウントが自動生成されて、以下の画面に移動するかと思います。
こちらで会話の詳細なロジックを組み立てていきます。

まず、Dialogflowを設定していく上でよく出てくる2つの言葉の意味を紹介します。

  • Intents:会話のブロックを作成する項目です。
  • Fulfillment:WebhookやFirebaseのInline Editorを使える項目です。ここでNode.jsを記述して、kintoneにHTTP Requestをします。

これらを頭に置いた上で、設定していきましょう。

  1. プロジェクトの初期設定をします。「DEFAULT LANGUAGE」欄で、「Japanese - ja」を選択して、「CREATE」ボタンをクリックしてください。

    8.png

  2. Intentsの作成画面に移動します。デフォルトで、「Default Fallback Intent」(エラーなどが起きた時の処理)と「Default Welcome Intent」(会話のきっかけ処理)が設置されているので、これはこのまま利用します。
    この後はここに必要なIntentを増やしていく流れになります。

    10.png

  3. まずはGoogle Homeとの会話のきっかけとなる「Default Welcome Intent」を編集するので、クリックしてください。

    11.png

    以下の図に沿ってユーザーが何といったいった時に、どう答えるのかを指定します。
    入力できたら上の「SAVE」ボタンをクリックして設定を保存してください。

    12.png

     User says  Text Response
    こんにちは

    こんにちは!kintoneに登録したいタスクを話しかけてください。
    また「タスクを確認」と話しかけると、今日締切のタスクをお伝えします。

  4. お気付きの方もいらっしゃると思いますが、Intentを設定している右側に「Test Console」があります。
    一旦会話のきっかけがちゃんとできているかどうか確かめてみましょう!
    ダイアログボックスに「こんにちは」と入力してみてください。レスポンスに指定した値が入ってくれば成功です。このまま続けて設定していきましょう。

    13.png

  5. 次に、左メニューの「Fulfillment」をクリックしてください。
    「Webhook」と「Inline Editor」の2つの選択肢が出てきますが、今回はFirebaseにコードを置くのでInline Editorの方を「ENABLED」にします。
    Editor下の「DEPLOY」ボタンを押して「View execution logs in the Firebase console」という文言が表示されるまで待ちます。(デプロイ自体に数分かかる場合があります)
    これでIntentをコード内で指定して操作することができます。今はコードの編集は必要ありません。そのままDEPLOYボタンをクリックしてください。
    ※ AWSのLambda & API Gateway/Zapier/Microsoft FlowなどでWebhookを生成した場合は、Webhook URLに設定することで開発可能です。

    14.png

  6. 左メニューより「Intents」に戻ります。
  7. 「CREATE INTENT」ボタンをクリックして、新規にタスク登録用のIntentを追加します。

    15.png

  8. 下図に沿ってIntentの詳細設定をします。設定できたら「SAVE」ボタンをクリックしてください。
    「〇〇を追加」という合言葉で新規にkintoneにタスクを登録できるようになります。
    さらに質問に続けてタスクの締切日を答えると、それも併せてレコードに登録されます。

    16.png

     Intent name  User says  Action Fulfillment
    AddTask タスクを追加
    (タスクをクリックして、@sys.anyを選択)
    input.task
    (パラメーターもtaskとdateを上図の通り設定)
    Use webhookにチェック
    (コード内で操作を制御するため)
  9. 次に、今日締切のタスクを確認するためのIntentを作成します。
    先ほどと同様に「CREATE INTENT」ボタンをクリックして、下図の通り設定して、「SAVE」ボタンをクリックしてください。

    17.png

     Intent name  User says  Action Fulfillment
    CheckTask - タスクを確認
    - タスクの確認
    - 今日のタスクは?
    - 本日のタスク
    - 今日締切のタスクは?
    - 締切のタスクは?
    check.task Use webhookにチェック
    (コード内で操作を制御するため)
  10. あとは会話の終わりを定義してIntentの設定は完了です。「CREATE INTENT」より以下の通り設定して、「SAVE」ボタンをクリックします。

    18.png

     Intent name  User says  Action Text response Google Assistant
    EndConversation - 終わり
    - またね
    - バイバイ
    - ありがとう
    end.conversation ありがとうございました!またね End conversationにチェック
    (会話の最後のため)
  11. これでIntentの設定が全て完了したので、左メニューよりFulfillmentにアクセスし、Inline Editorの「index.js」にkintoneにHTTPリクエストをするためのコードを記述します。
    コード部分はDialogflowのFulfillmentに予め記載されているサンプルコードを一部そのまま利用しています。
    コード内の最初の方にkintoneアプリの情報を記述している箇所があるので、それぞれの環境に合わせた内容に変更してください。(appId/token/domain部分です)

    19.png

     

  12. Inline Editorの「package.json」に以下を記述します。デフォルトのpackage.jsonにHTTP Requestで利用するrequestモジュールを追記しています。

    packageJSON.png

  13. 「DEPLOY」ボタンをクリックします。下図の通り、「View execution logs in the Firebase console」とログが出力されれば成功です。

    20.png

  14. 実際にHTTP Requestが成功するか「Test Console」で会話をして試してみてください。kintoneアプリ側にレコードが登録されたらOKです。

    21.png

  15. また「Inline Editor」下の「View execution logs in the Firebase console」のリンクをクリックしてください。
    Firebaseの画面に遷移してログを見ることができるようになっているので、そちらも確認しておきましょう。デバッグする時に活用できます。
  16. ひとまずこれにて設定完了です。

動作確認

あとはActions on Googleの画面に戻って音声でのテストをしてみましょう!実際にGoogle Homeを使ってもOKです。

  1. 作成したプロジェクトのOverview画面から「TEST DRAFT」をクリックして、Simulatorを立ち上げます。

    22.png

  2. Surfaceを「Speaker」に、Languageを「Japanese - ja」に設定して、左側の入力ダイアログにてテストを行います。
    テスト用のSimulatorなので、会話のきっかけとして設定した「こんにちは」の代わりに、合言葉として必ず「テスト用アプリにつないで」という呼びかけが必要になります。
    上記画像の「Overview > App Information > Edit > Detail > Sample invocations」箇所を設定することで「テスト用アプリにつないで」以外のきっかけで動作させることもできますが、ここでは割愛します。
    ※ Google Homeの実機でテストする場合は、「OK, google テスト用アプリにつないで」と呼びかけてください。

    23.png

  3. 会話をすると以下のようになります。Google Homeでも試してみてください。

    24.png

  4. 念のためkintoneにも無事レコードが登録されていることを確認します。

    25.png

※ 実際に運用するアプリケーションとして公開する場合は、Actions on Google画面(本Tipsの動作確認 > 手順1の箇所)で追加情報を記載して、審査を通す必要があります。詳細についてはこちらをご参照ください。

サンプルコードの解説

途中で出てきたNode.jsの実装ポイントを少し解説します。今回はDialogflow V1 APIを利用しています。

大まかな流れだけ抜き出すと以下のようになります。

  1. ライブラリやモジュールのインストール
  2. addTask関数を定義して、その中でレスポンスの形式を定義 & kintoneへのHTTP Requestを送信
  3. 実行関数を定義

 

その他注意ポイントは以下です。

  • 実行関数名は、必ず「dialogflowFirebaseFulfillment」にする
  • Google Assistantからのレスポンスには様々な形式があるので、それをうまく変換する関数を用意
  • actionHandlers内で、作成したIntentごとの処理を記載
  • 指定したIntent以外が発生した場合は、default Intentに誘導

おわりに

無事Google Homeと会話をしてタスクの登録 & 確認ができましたでしょうか?
今回はシンプルな構成でしたが、工夫の幅は無限大です。ぜひスマートスピーカーのメリットを活かした使い方を考えて、開発してみてください。
設定項目も多いので、最初は扱うのが大変ですが、慣れれば楽しく連携できます!

注意事項

  • Dialogflow V2 APIも利用可能ですが、本TipsではV1 APIを利用しているので、API VERSIONを変更すると動作しない場合があります。
  • Firebaseはβ版なので、ご利用の際にはご注意ください。
  • 今回のGoogle Home連携はDialogflowの「Test console」とActions on Googleの「Simulator」でのみ利用できます。アプリを公開する際は、別途手続きが必要ですので、ドキュメントをご確認ください。
  • 英語のみの対応で良い場合は、Dialogflowではなく、Converse AIを選択すると、GUIのみで簡単に設定できます。(HTTP Request部分もほとんどコードを書かずに済みます)
  • kintoneのBasic認証も設定している場合は、認証情報を追記してください。
  • 本Tipsは、2018年1月時点で正常に動作することを確認しています。

本Tipsは、2018年1月版 kintoneで確認したものになります。

記事に関するフィードバック

直接的に記事と関連がないご質問はcybozu developer コミュニティをご活用ください。

ログインしてコメントを残してください。