Cloud Funtionsを使用してHangouts Chat Bot作ってみる

はじめに

Hangoutで動くBotを作って利用していましたが、
使用していたBOTライブラリが動作しなくなったので
ひとまずHangoutsChatBotはどう作るかを試してみました。

ハングアウトBotを作ってみる
G Suite 組織内ユーザーの予定を名前から取得してみる

Hangouts Chat Botって？

Google Hangouts Chat Botについてとか
Chat Bot Conceptsを参照してください。

どうやって作る？

Hangouts Chat Botって？の部分のリンクにもありますが、
いくつか作る方法があります。

• Google Apps Script Bot - GASを使用して作成。
• Google Cloud Functions bot - Cloud FunctionsにBotの処理を作成。Node.jsおよびPythonで作成出来る。
• Incoming webhook - webhookを使用してBotを作成する。サンプルはPythonだけど何でもいい気がする。
• REST API - デベロッパーページにサンプルは無いけどREST APIを使用してBotを作成出来る。主要な言語のクライアントライブラリは用意されている。

今回はGoogle Cloud Functionsを使用したBotを作成します。
※Hangouts Chatリリース後にGASとかwebhookを使用したBotの作り方は見かけたけど、Cloud Functionsを使ったのはあまり見かけなかったので。

前提条件

アカウント

Googleアカウント。
Google Cloud Consoleで請求先が設定されていること。

作成手順

チュートリアルを元にCloud Functions Botを作成

その1ではHangouts Chat Botのデベロッパーページのチュートリアルを元にCloud Functions Botを作成します。

1. Cloud Functionsの作成

• Google Cloud Consoleを開き、新しいプロジェクトを作成します。

• APIライブラリからCloud Functions APIを有効にします。
  

• コンソールのナビゲーションメニューからCloud Functionsのページに遷移
  

• Cloud Functionsのページから関数を作成をクリックし、関数を新規作成する。
  

• 各種設定は以下の通り
  

• ソースファイル以下のものをコピペします。

/**
 * Google Cloud Function that responds to messages sent from a
 * Hangouts Chat room.
 *
 * @param {Object} req Request sent from Hangouts Chat room
 * @param {Object} res Response to send back
 */
exports.helloHangoutsChat = function helloHangoutsChat (req, res) {

  var sender = req.body.message.sender.displayName;
  var image = req.body.message.sender.avatarUrl;

  var data = createMessage(sender, image);

  res.send(data);
};

/**
 * Creates a card with two widgets.
 * @param displayName the sender's display name
 * @param imageURL the URL for the sender's avatar
 */
function createMessage(displayName, imageURL){
  var HEADER = {
    "title": "Hello " + displayName + "!"
  };

  var SENDER_IMAGE_WIDGET = {
    "imageUrl": imageURL
  };

  return {
    "cards": [{
      "header": HEADER,
      "sections": [{
         "widgets": [{
           "textParagraph": {
             "text": "Your avatar picture:"
           }
         }, {
           "image": SENDER_IMAGE_WIDGET
         }]
      }]
    }]
  };
}

• 上記設定を行った後、作成ボタンをクリックし作成します。※ビルドに30秒～1分位掛かったりします。

2. Hangouts Chat Botの公開設定

Hangouts Chat Botの公開設定を行っていきます。

• APIライブラリからHangouts Chat APIを有効にします。
  

• Hangouts Chat APIの設定は以下の通り、接続設定のBotURLはCloud FunctionsのURLを設定します。
  

• 上記設定を行った後、変更を保存ボタンをクリックし保存します。

3. 作ったBotを動かす

• Hangouts Chatを開きます。

• 検索窓からbotにメッセージを送信を選択。
  

• botを検索から作成したBotの名前を入力すると候補に出てくるので、メッセージをクリック。
  

• Botとダイレクトメッセージでチャットする画面に遷移します。
  

• Botに話かけると挨拶とアカウントのアイコン画像が表示されます。
  

• これでサンプルの作成・動作確認が終了です。

気づいたこととか

• Bot作成自体は簡単に出来る。
• Bot自体は1つのプロジェクトにつき1つしか作ることが出来ない。(Hangouts Chat APIが複数対応していないので)
• Botの名前に日本語設定しても反映されなかった…。