Help us understand the problem. What is going on with this article?

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

はじめに

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公式で便利な機能を提供してくれるといいなーと思っています。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした