ムラウチドットコム エンジニアブログ

日本最大級ブログランキング「にほんブログ村」、シンプルなブログサービス「muragon」を運営するムラウチドットコム メディアグループのエンジニアブログです。

SlackからGoogle Homeを喋らせてみた


経緯

先月発売されたスマートスピーカーのGoogle Home ですが、遂に当社にも設置されました!



どうせなら何かやってみたいと思い、当社で利用しているチャットツール Slack からGoogle Homeに喋らせてみることにしました。


Slackだとメンション(@) を使えば特定ユーザーや全員に簡単に通知できますが、相手が画面を見ていなかったり、作業に集中して気付かない可能性があります。
そんな時は、Google Homeに喋らせることにより直ぐ気づいてもらえます。


概要

やりたいことはとりあえず以下の3点

  1.  @xxxxx でGoogle Homeに喋らせたい
  2.  @xxxxx に続いて喋る内容を入力したい
  3.  @xxxxx @hoge でGoogle Homeに喋らせつつ、他の人に通知もしたい

構成

調べたところ、ローカルのGoogle Homeに文字を読ませるgoogle-home-notifierというツールがありましたので、こちらをvagrant上に立ち上げ外部からの受け口にします。


そのままSlackから仮想環境に送っても良かったのですが、どうせならGoogle Apps script ( GAS )を利用して、入力されたテキストを丸めたり簡単な処理をやってみようかと思います。


Slack → GAS → 仮想環境 → Google Home
流れとしてはこのようになります。
URLの設定等がありますので、
仮想環境→GAS→Slack の順番で説明いたします。
Google Homeは特に設定の必要がありません。


構築

仮想環境

他の方は、Raspberry Piにインストールしていましたが、持っていなかったので自分はvagrantでubuntuを起動させてやってみました。nodeは最新を入れないとエラーになります。


https://github.com/noelportugal/google-home-notifier


$ git clone https://github.com/noelportugal/google-home-notifier.git
$ vim google-home-notifier/example.js


このファイルの10行目くらいに下記を追加しました。
IPはGoogleHomeに割り当てられたIPを指定してください。

googlehome.device(deviceName, 'ja').accent('ja').ip('192.168.10.xxx');


保存後、npm example.js で立ち上がります。


ngrok の設定もしてくれるので、仮想環境だけど外部からの実行が可能になります。
後は表示されたcurlをコピペして実行すればGoogleHomeが喋り始めます。


example:
curl -X POST -d "text=Hello Google Home" https://hogehoge.ngrok.io/google-home-notifier


https://hogehoge.ngrok.io/google-home-notifier
これが今回のURLになります。
google-home-notifierを再起動させると、サブドメインが変更されます。


Google Apps script

GoogleドライブからGoogle Apps script を新規作成。
GASにPOSTされたらテキストを修正して、Google Homeに通知というのでこんな感じで書いてみました


function doPost(e) {
  var token = "fugafugafuga";

  if (token != e.parameter.token) {
    return;
  }
  var text = e.parameter.text.replace(/<@[a-zA-Z0-9].*?>/, '').slice(0, 50);
  var user_name = e.parameter.user_name;
  text = user_name + 'の発言      ' + text;
  return request(text);
}


function request(text) {

  var url = 'https://hogehoge.ngrok.io/google-home-notifier';
  var urlFetchOption = {
    'method' : 'post',
    'contentType' : 'application/x-www-form-urlencoded',
    'payload' : { 'text' : text}
  };

  var response = UrlFetchApp.fetch(url, urlFetchOption);
  return response;
}


token は、Slackからのリクエストに含まれる一意のパラメータになります。
後ほどslackの設定をした際に表示されるので、それを設定してください。公開後に誰でも実行できないようにここで処理を終わらせるようにします。
url には最初に仮想環境で設定されたURLを貼り付ける。

var text = e.parameter.text.replace(/<@[a-zA-Z0-9].*?>/, '').slice(0, 50);
var user_name = e.parameter.user_name;
text = user_name + 'の発言' + text;

Slackから送られてくるテキストだと、ユーザーIDも含まれてしまうので、それを先に削って先頭に発言者の名前をくっつけています。


保存して公開ボタンからWebアプリケーションとして導入を押下し、
アプリケーションにアクセスできるユーザーを「全員(匿名含む)」を選択、URLをメモして更新ボタンを押します。


Slack

BOTを作成し、Outgoing WebHooksを設定しGASにリクエストを送ります。


https://api.slack.com/apps
BOTに関しては、上記から 

  1. "Create New App" で 任意の名前を入力 
  2. "Add features and functionality" で Botsを選択
  3. "Add Bots User" から名前を入力し、Add Bot Userを押下

今回は使わないのですが、GoogleHomeからSlackとの連携というのも面白そうですね。


下記のページから、Outgoing WebHooksを検索し作成致します。
https://xxxxxxx.slack.com/apps



Channel にはトリガーを拾いたいチャンネルを設定。全てのチャンネルで使いたかったのでAnyにしました
Trigger Word(s) に作ったBOTのIDを <@XXXXXXX> の形で入力。IDはBOTをチャンネルに招待して、右クリックしCopy Linkの中身を見ると「https://hoge.slack.com/services/XXXXXXX」となっておりますので、この末尾になります
URL(s) に先ほど公開したGASのアプリケーションURL
Token の値をコピーして、GASのtoken変数に代入させます


Save Settings を押して準備は完了です
後は @googlehome 喋ってほしい内容 を打てば勝手に喋ってくれるはずです。

動作

実際に動かしてみました
GASのuser_nameを喋る箇所だけコメントアウトしてあります




slackからGoogleHomeを喋らせてみた


無事に喋ってくれましたね


まとめ

今回はGoogleHomeに喋らせるだけという内容でしたが、
他にもActions on Googleを使ってのアプリ開発など様々なことが出来るようです。


また、今日から国内販売されたAmazon Echo 


ますます盛り上がりをみせるスマートスピーカー
これからどうなるのかとても楽しみですね

×

非ログインユーザーとして返信する