Posted at

Google Homeをブラウザから喋らせてみる

More than 1 year has passed since last update.


はじめに

Google Homeを最近買ったのでいろいろ遊んでみました。

Google Homeでは自発的に喋らせる機能が標準で備わっていません。

しかし、google-home-notifierを使うと、コマンドで喋らせることが可能です。

↓こちらの記事が参考になりました。

Google Home開発入門 / google-home-notifier解説

ちょっと試してみましょう。


コマンドで喋らせてみる


google-home-notifierをインストール

$ npm init

$ npm i-S google-home-notifier


jsファイルの作成


main.js


/**
* 設定
*/

const googlehome = require('google-home-notifier');
const msg = process.argv[2] || 'なんか喋ってよ'; // process.argv[2]で引数を取得。ない場合はデフォルトメッセージを代入

/**
* 喋らせる関数
*/

function say(text, language = 'ja'){
googlehome.device('Google-Home', language);
googlehome.notify(text, function(res) {
console.log(res);
});
}

say(msg); // 英語にしたい場合は第二引数を'en'にする


あとは、以下コマンドを叩くだけ!

main.jsの後に好きな日本語を書くと、その通りにGoogle homeが喋ってくれます。

$ node main.js 私はGoogleだっ!

ただし、実態はGoogle Text To Speachを使って音声ファイルを再生しているので、Google Homeが喋ってるわけではありません。(Google Homeよりちょっとカタコトです)

うーん、ちょっと残念。

早くGoogle Homeに直接喋らせるAPIができて欲しいです。


ブラウザから実行できるようにする

コマンド打つのは面倒だし、誰でも気軽にできるように、ブラウザから実行できるようにしてみようと思います。


必要なプラグインをインストール

$ npm init

$ npm i -S express body-parser


先ほどのmain.jsを以下のようにカスタマイズ

コマンドではなく、postで受け取ったタイミングで実行するようにしています。


main.js

/**

* 設定
*/

const googlehome = require('google-home-notifier');
const express = require('express');
const bodyParser = require('body-parser');
const app = express();
const msg = process.argv[2] || 'なんか喋ってよ'; // process.argv[2]で引数を取得。ない場合はデフォルトメッセージを代入
const port = 8001;

/**
* ローカルサーバー起動
*/

app.use(bodyParser.urlencoded({extended: true}));
app.use(bodyParser.json());
app.use(express.static('./'));
app.listen(port, ()=> {
console.log(`http://localhost:${port}/`);
});

/**
* 喋らせる関数
*/

function say(text, language = 'ja'){
googlehome.device('Google-Home', language);
googlehome.notify(text, function(res) {
console.log(res);
});
}

/**
* POST時の処理
*/

app.post('/', function(req, res){
let msg = req.body.msg;

say(msg);
res.send({ response : msg });
});



htmlを作成する

あとは、上記main.jsをブラウザから実行できるようにfetch()でpostします。


index.html(主要な部分だけ)

fetch('./', {

method: 'POST',
cache: 'no-cache',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ msg: '★ここに喋らせたい内容を投げ込む' })
})
.then(res => res.json())
.catch(error => console.error('Error:', error))
.then(response => console.log('Success:', response));


画面の作成

あとはこんな感じの画面を作って上記scriptを実行させるだけです。

(コードは割愛します)

画面


コマンドを実行

main.jsを実行します。

$ node main.js

これでローカルサーバーが立ち上がるので、http://localhost:8001/ にアクセスして遊んでみましょう

また、http://***.localhost:8001/のURLでスマホからもアクセスできるので、手軽に遊べます。(***はMacのマシン名)

ただし、Macがスリープしちゃうともちろん実行できなくなくなるので、ご注意を。


最後に

意外とカンタンにGoogle Homeを喋らせることができました。

ただ、今回のサンプルでは自宅内でしかできないので、外部から実行ができません。

Raspberry Piなどで自宅サーバーを作ればいいんでしょうけど、そこまでするのは面倒。。

なので、そのうちGoogle公式で便利な機能を提供してくれるといいなーと思っています。