Slack Botの土台をGASで構築

Slack Botの土台をGASで構築

業務効率を上げたり, 時には癒しをくれたり, 調べてみると様々なBotの活用事例があるようです. この記事ではSlackBotの土台となるものをGASで構築していきます.

ゴール

この記事を読んだらなにができるようになるかを述べておきましょう. 本記事におけるBotの土台とは,

Slackで特定のワードを発言すると, Botが反応して一定の返事をくれる

というものです. これだけっちゃこれだけですが, GASを利用しているので, 以下のようなBotに発展させることもできるでしょう.

手順

以下のような手順で進めていきます.

  • Webhook URLを取得
  • SlackからPOSTリクエストを受け取り, POSTリクエストを返す機構をGASで構築
  • SlackからPOSTリクエストを発行するためのトリガーを設定

Webhook URLを取得

Webhook URLというのは, メールアドレスのようなものですね. このURLに対しPOSTリクエストを投げることで, Slackにメッセージを投稿することができます. ではやっていきましょーう.

まずはSlack APIにアクセスしましょう. 右上のCreate New Appをクリックします. そうなんです実は, これからBotをSlackアプリとして作ろうとしているんですね. さてCreate New Appをクリックすると次のようなダイアログが出現します.

f:id:riemann1618:20180928204913p:plain

上の欄には好きなアプリ名を, 下の欄では実験用のWorkspaceを選択しましょう. 注意書きにあるように, アプリ名は後から変えられるので心配いりません.

入力を終えたらCreate Appをクリックします.

すると以下のようなページに飛びます.

f:id:riemann1618:20180928205106p:plain

まずはBotsをクリックし, このアプリがBotとして動作するよう設定します. といっても2つの入力欄を埋め, Always Show My Bot as Onlineをオンにするだけです.

f:id:riemann1618:20180928205817p:plain

この設定を保存したら, 次に左のメニューのIncoming Webhooksをクリックし, トグルをONにします.

f:id:riemann1618:20180928210003p:plain

下の方にいってAdd New Webhook to Workspaceをクリック.

f:id:riemann1618:20180928210058p:plain

Botからの返信を待ち受けるチャンネルをここで選択します. 選択できたらAuthorizeをクリック.

f:id:riemann1618:20180928210439p:plain

するとSuccess!というFlashメッセージとともに, 先のページにリダイレクトされます. 下のほうをみると, Webhookが追加されているのがわかりますね. Webhook URLもちゃんと書いてあります. これで第一段階は終了です.

f:id:riemann1618:20180928210758p:plain

SlackからPOSTリクエストを受け取り, POSTリクエストを返す機構をGASで構築

さて次はGASです. Google ドライブ にアクセスし, GASプロジェクトを新規作成します. プロジェクト名はお好きに決めてください.

f:id:riemann1618:20180928211112p:plain

ここからはコーディングです. GASのベースはJavaScriptですから, メソッド名の最後に()をつけたり, 式をセミコロンで締めくくったり, 気をつけなければならないことがたくさんありますね...

// POSTリクエストを受け取る関数
function doPost(e) {
  
  // Webhook URLを変数に格納
  var url = 'https://hooks.slack.com/services/ほにゃらら';
  
  // メッセージ本文
  var payload = {
    'text': 'ここが本文'
  };

  // HTTPリクエストの設定
  var options = {
    'method': 'post',
    'contentType': 'application/json',
    'payload': JSON.stringify(payload)
  }
  
  // SlackへのPOSTリクエストを発行
  UrlFetchApp.fetch(url,options);
}

各コードの意味はコメントに書いたので, だいたい理解できるかと思います.

コードが書けたら上の方にあるデバッグボタンを押して, 問題がないかチェックします. 問題がなければコードが実行されるので, Slackチャンネルに「ここが本文」というメッセージが投稿されるはずですが, どうでしょうか...?

次はこのアプリをネット上に公開する必要があります. そうでないとSlackからPOSTリクエストを投げられないですからね. 上の方の「公開」から, 「アプリケーションとして導入」を選択します.

f:id:riemann1618:20180928211535p:plain

アプリケーションにアクセスできるユーザーを, 「全員(匿名ユーザーを含む)」に設定し, 「導入」をクリックします. 「変更内容の説明」は空欄でOKです.

f:id:riemann1618:20180928211553p:plain

すると承認が必要という旨のダイアログが出るので, 誘導にしたがって承認作業をしてください.

次のようなダイアログが出れば成功です. 「現在のウェブ アプリケーションのURL」はあとで使うので, ダイアログは出したままでOKです.

f:id:riemann1618:20180928211923p:plain

これで第二段階は終了です.

SlackからPOSTリクエストを発行するためのトリガーを設定

次は, SlackにTrigger wordを設定します. まず実験用に用意したWorkspaceへアクセスしてください. 左のペインからアプリを検索します.

f:id:riemann1618:20180928212222p:plain

Outgoing WebHooksを検索します. 数文字入力すれば十分でしょう. インストールボタンをクリックします.

f:id:riemann1618:20180928212307p:plain

Add Configurationをクリックします.

f:id:riemann1618:20180928212642p:plain

次のページでAdd Outgoing WebHooks integrationをクリックします.

リダイレクト先のページを下にスクロールすると, 以下のような入力フィールドが現れます.

f:id:riemann1618:20180928212911p:plain

ChannelではTrigger wordに反応してほしいチャンネルを選択します.

Trigger wordsはコンマ区切りで入力しましょう.

URLにはさっきの「現在のウェブ アプリケーションのURL」を入力します.

以上の入力ができたら一番したまでスクロールし, Save Settingsをクリックします.

これで第三段階も完了です.

完成とその後

これで全ての手順が終了しました. Slack上でTrigger wordを送信すると, 自動で返信が来ることが確認できるかと思います. 返信の表示形式をもっとリッチにする方法を, またこんど記事にするつもりです.

そして上でも述べましたが, GoogleカレンダーGoogle翻訳, Gmailなどのサービスを活かしたBotを作成することもできます. 本格的なBotを作るのは無理でも, 多少遊んでみるくらいはできそうです.