Google Home に「そして かがやく」と話しかけると「ウルトラソウル」と答えてもらうようにしてみた件

Google Home に「そして かがやく」と話しかけると「ウルトラソウル」と答えてもらうようにしてみた件

ビックカメラで Google Home と Chromecast のセットが 15,120 円 (税込) ということで発売日の 10/6 に購入してきました。普段、電気製品はヨドバシで購入するのですが、ヨドバシでは発売日の時点で Google Home を取り扱っていないようだったので。しかしこの額は Google Home の定価そのまんまなので、ビックカメラで 4,978 円 (税込) の Chromecast がまるまるオマケ扱いですね。

しかし、普段は Apple (iOS, macOS) 周りのサービスしか使用していないため、Android 端末も持っておらず、Google 周りのコンテンツサービスも使用していません。Google Cloud Platform を使用しているくらいです。

というわけで、Google Home と連携するようなアプリケーションはどのようにつくるのかというのを体験するため、Actions on Google と API.AI を使用して、「そして かがやく」と話しかけたら「ウルトラソウル」、そして、「ウルトラ ソウル」と話しかけたら「ハイ」と答えるようなものをつくってみました。

下記のブログが非常に参考になりました。というか、下記のブログに書かれていること、ほとんどそのままでいけました。

Actions on Google入門
https://kotodama.today/?p=45

Actions on GoogleでGoogleHome向けTwitter検索アプリを作ってみる【Project作成編】
https://kotodama.today/?p=93

Actions on GoogleでGoogleHome向けTwitter検索アプリを作ってみる【Fulfillment作成編】
https://kotodama.today/?p=191

Actions on GoogleでGoogleHome向けTwitter検索アプリを作ってみる【テスト編】
https://kotodama.today/?p=228

さて、前提としては下記の通りです。

  • Google Home 本体
  • Firebase を使えること
  • Google Home 用のアカウントと Firebase 用のアカウントが同じであること
  • Node.js と npm が動作する環境

Actions on Google

Actions on Google
https://console.actions.google.com/

Add/import project をクリックし、Add project を設定します。適当なプロジェクト名と Japan を設定しておきます。日本語対応してるようです。

Project name actionexample
Country/region Japan

そして、CREATE PROJECT ボタンをクリックします。

Overview ページに遷移します。そこで、API.AI の BUILD ボタンをクリックします。Use API.AI to add actions to your Assistant app 画面が表示されます。CREATE ACTIONS ON API.AI ボタンをクリックします。API.AI https://console.api.ai/ へ遷移します。

API.AI

ここからは API.AI https://console.api.ai/ での操作となります。

Insufficient permissions が表示されるため、AUTHORIZE をクリックします。Agent name 画面へ遷移します。DESCRIPTION は適当に入力し、DEFAULT LANGUAGE を Japanese – Ja、DEFAULT TIME ZONE を Asia/Tokyo、GOOGLE PROJECT を先ほど作成した actionexample と設定し、SAVE ボタンをクリックします。日本語対応してるようです。

Intents 画面に遷移します。CREATE INTENT ボタンをクリックします。User says に「ウルトラ ソウル」(間にスペースあり) と入力し、エンターキーを押します。Action に ultraSoul と入力します。Fulfillment をクリックし、Use webhook にチェックを入れます。Google Assistant をクリックし、End conversation にチェックを入れます。SAVE ボタンをクリックします。

さらに CREATE INTENT ボタンをクリックし、新しい Intent を作成します。User says に「そして かがやく」(間にスペースあり) と入力し、エンターキーを押します。Action に soshiteKagayaku と入力します。Fulfillment をクリックし、Use webhook にチェックを入れます。SAVE ボタンをクリックします。

Default Welcome Intent は、Events に WELCOME や GOOGLE_ASSISTANT_WELCOME を追加し、Fulfillment をクリックし、Use webhook にチェックを入れます。SAVE ボタンをクリックします。

Fulfillment 作成

ここからは Ubuntu 16.04.3 上で実行します。

Node.js と npm をインストールします。

curl -sL https://deb.nodesource.com/setup_6.x | sudo -E bash -
sudo apt-get install nodejs
node -v
v6.11.4
npm -v
3.10.10

Firebase CLI をインストールし、login します。

sudo npm install -g firebase-tools
firebase login

適当なディレクトリに移動し、firebase init functions を実行し、カーソルキーでプロジェクトを指定します。

firebase init functions

     ######## #### ########  ######## ########     ###     ######  ########
     ##        ##  ##     ## ##       ##     ##  ##   ##  ##       ##
     ######    ##  ########  ######   ########  #########  ######  ######
     ##        ##  ##    ##  ##       ##     ## ##     ##       ## ##
     ##       #### ##     ## ######## ########  ##     ##  ######  ########

You're about to initialize a Firebase project in this directory:

=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add, 
but for now we'll just set up a default project.

? Select a default Firebase project for this directory: 
  [don't setup a default project] 
❯ actionexample (actionexample) 
  xxx (xxx) 
  [create a new project] 

プロジェクトを設定後、

=== Project Setup

First, let's associate this project directory with a Firebase project.
You can create multiple project aliases by running firebase use --add, 
but for now we'll just set up a default project.

? Select a default Firebase project for this directory: actionexample (actionexample)

=== Functions Setup

A functions directory will be created in your project with a Node.js
package pre-configured. Functions can be deployed with firebase deploy.

✔  Wrote functions/package.json
✔  Wrote functions/index.js
? Do you want to install dependencies with npm now? Yes

> grpc@1.6.0 install functions/node_modules/firebase-admin/node_modules/grpc
> node-pre-gyp install --fallback-to-build --library=static_library

[grpc] Success: "functions/node_modules/firebase-admin/node_modules/grpc/src/node/extension_binary/node-v48-linux-x64/grpc_node.node" is installed via remote

> protobufjs@6.8.0 postinstall functions/node_modules/firebase-admin/node_modules/google-gax/node_modules/protobufjs
> node scripts/postinstall

i  Writing configuration info to firebase.json...
i  Writing project information to .firebaserc...

✔  Firebase initialization complete!

完了後、firebase.json と functions ディレクトリが作成されます。functions ディレクトリには index.js 等が作成されます。

├── firebase.json
└── functions
    ├── index.js
    ├── node_modules
          .....
    └── package.json

npm で actions-on-google をインストールしておきます。

cd functions
npm install actions-on-google --save

index.js を編集します。

'use strict';

process.env.DEBUG = 'actions-on-google:*';
const App = require('actions-on-google').ApiAiApp;
const functions = require('firebase-functions');

exports.helloWorld = functions.https.onRequest((request, response) => {

  const app = new App({request, response});

  function responseHandler (app) {
    app.ask('ようこそ');
  }

  function ultraSoulHandler (app) {
    app.ask('ハイ');
  }

  function soshiteKagayakuHandler (app) {
    app.ask('ウルトラソウル');
  }

  const actionMap = new Map();
  actionMap.set('input.welcome', responseHandler);
  actionMap.set('ultraSoul', ultraSoulHandler);
  actionMap.set('soshiteKagayaku', soshiteKagayakuHandler);
  app.handleRequest(actionMap);
});

Firebase の Functions にデプロイします。Google Cloud Platform でいうところの Cloud Functions ですね、サーバーレスですね。

firebase deploy --only functions
1

=== Deploying to 'actionexample'...

i  deploying functions
i  functions: ensuring necessary APIs are enabled...
i  runtimeconfig: ensuring necessary APIs are enabled...
✔  runtimeconfig: all necessary APIs are enabled
✔  functions: all necessary APIs are enabled
i  functions: preparing functions directory for uploading...
i  functions: packaged functions (863 B) for uploading
✔  functions: functions folder uploaded successfully
i  starting release process (may take several minutes)...
i  functions: creating function helloWorld...
✔  functions[helloWorld]: Successful create operation. 
✔  functions: all functions deployed successfully!

✔  Deploy complete!

Project Console: https://console.firebase.google.com/project/actionexample/overview
Function URL (helloWorld): https://xx-xxx-actionexample.cloudfunctions.net/helloWorld

Function URL が重要となります。

再度 API.AI

API.AI に戻ります。Fulfillment を選択し、Webhook を ENABLED にします。Firebase へのデプロイ完了後に表示された Function URL を URL に入力します。SAVE ボタンをクリックします。

Integrations を選択し、One-click integrations で Google Assistant をクリックします。ポップアップウィンドウが表示されます、Welcome Intent では Default Welcome Intent を選択し、AUTHORIZE をクリックします。TEST ボタンが表示されるようになります。TEST ボタンをクリックします。Test now active という表示とともに VIEW ボタンが表示されるようになります。VIEW ボタンをクリックすると、シミュレータが起動しますが、ここでは UPDATE DRAFT ボタンをクリックします。Actions on Google draft successfully updated という表示と共に VIEW CONSOLE ボタンが表示されます。VIEW CONSOLE ボタンをクリックすると、Actions on Google https://console.actions.google.com/ に戻ります。

再度 Actions on Google

Actions on Google https://console.actions.google.com/ に戻った後、プロジェクトを選択し、Overview が表示されると、1 Actions までは完了しています。2 App information をクリックし、ADD ボタンを押します。Assistant app name を my test app と書いておき、Pronunciation を「テスト 用 アプリ」(間にスペースあり) と書き、他の必要な項目は適当な内容を書き、SAVE ボタンをクリックします。1920×1080 と 192×192 の画像を用意していないとエラーになります。

エラーなく SAVE が完了した後、TEST DRAFT ボタンを押すとシミュレータが起動します。シミュレータでは、Surface で Speaker (e.g. Google Home) を指定し、Language で Japanese (Japan) を設定し、Location は日本のどこかを設定しておきます。その後、画面下部の input に「テスト用アプリにつないで」と入力します。シミュレータが「わかりました。テストバージョンのテスト用アプリです。ようこそ」と答えることを確認します。続いて、input に「そしてかがやく」と入力するとシミュレータが「ウルトラソウル」と答え、input に「ウルトラソウル」と入力すると「ハイ」と答えることを確認します。

Google Home 実機確認

シミュレータでの動作が成功したら Google Home 実機で確認します。

自分 「おっけー、グーグル。テスト 用 アプリ につないで」
Google Home 「わかりました。テストバージョンのテスト用アプリです。ようこそ」
自分 「そして かがやく」
Google Home 「ウルトラソウル」
自分 「ウルトラ ソウル」
Google Home 「はい」

自分 「・・・・・」

3連休の夜中の4時まで何やってんだ・・・という話。

Actions on Googleカテゴリの最新記事