SlackでリアクションBotをつくろう！（GAS）

はじめに

Slack でリアクションBotをつくろうとしたら思いの外ハマったので備忘録。
GAS を使います！

成果物

ゴリラの後に１５種類のうんちをつけるBotができたよ😆 pic.twitter.com/REtkoDYgfd

— am10 (@am103141592) May 19, 2020

我々の Slack はうんち絵文字が充実している
すぐにゴリラリアクションを消せばだれがうんち付けたかは迷宮入りになる。。。 （うんちリアクションは Bot が付けたことになります）

つくりかた

手順

1. GAS作成（公開してURLメモ）
2. Slack App作成（権限設定してトークンメモ）
3. GAS修正（トークン付与、Bot実装）
4. Slackチャンネルにアプリ追加

1. GAS作成（公開してURLメモ）

上記のようにGASプロジェクトを新規作成して下記コードを記述して保存する。

function doPost(e){
  var json = JSON.parse(e.postData.getDataAsString());
  return ContentService.createTextOutput(json.challenge);
}

公開 -> ウェブアプリケーションとして導入... で下記のように設定し Deploy して表示される Current web app URL をコピーしておく。

2. Slack App作成（権限設定してトークンメモ）

Slack API にアクセスして Create New App をクリックして App Name と Workspace を入力する。

Event Subscriptions のページを開き Enable Events を ON にする。Request URL に先程コピーした URL を入力する。問題なければ下記のように Verified と表示される。

Subscribe to bot events で Add Bot User Event をクリックし、reaction_added を追加して Save Changes をクリックする。

OAuth & Permissions のページを開き Bot Token Scopes に reactions:write を追加して Install App to Workspace をクリックする。（reactions:read も無ければ追加する）

Bot User OAuth Access Token が表示されるのでコピーしておく。

3. GAS修正（トークン付与、Bot実装）

GASを下記のように修正する。

function doPost(e){
  // 追加のトリガーとなるemoji
  var reaction_torigger_emoji = "gorilla";
  var json = JSON.parse(e.postData.getDataAsString());
  var event = json.event;
  if (event.type === "reaction_added") {
    if (reaction_torigger_emoji.indexOf(event.reaction) >= 0) {
      addReaction(event.item);
    }
  }
  return ContentService.createTextOutput(json.challenge);
}

function addReaction(item){
  var token = PropertiesService.getScriptProperties().getProperty('SLACK_ACCESS_TOKEN');
  var method = 'post';
  var url = 'https://slack.com/api/reactions.add?' + 'token=' + token + '&channel=' + item.channel + '&timestamp=' + item.ts + '&name=';
 
  var payload = {};
  var params = {
    'method': method,
    'payload': payload
  };
  // 追加対象のemoji
  var reaction_emojis = [
    "fucking_apple", "fucking_google", "fucking_docomo",
    "fucking_emojidex", "fucking_facebook", "fucking_htc",
    "fucking_joypixels", "fucking_lg", "fucking_messenger",
    "fucking_mozilla", "fucking_ms", "fucking_openmoji",
    "fucking_softbank", "fucking_twitter", "fucking_whatsapp"
  ];
  for (var i = 0; i < reaction_emojis.length; i++) {
    Utilities.sleep(1000);
    UrlFetchApp.fetch(url + reaction_emojis[i], params);
  }
}

ファイル -> プロジェクトのプロパティ -> スクリプトのプロパティから下記のように先程コピーしたトークンを追加する。

ファイル -> 版を管理... -> Save new version でバージョンを追加する。
公開 -> ウェブアプリケーションとして導入... -> Project version に追加したバージョンを設定して更新する。
許可画面が表示されるので適宜許可設定を行う。

4. Slackチャンネルにアプリ追加

Slackを開いてアプリを追加したいチャンネルの詳細 -> アプリ追加から作成したアプリを追加する。

完成！！

ハマりポイント

色々ハマったポイントがあるのでそれぞれの解決策です。

Event Subscriptionsがちゃんとできているかわからない

最初まったくリアクションしてくれなくて Slack のリアクションを GAS で本当に受けているのか？となりました。
下記のように Slack でリアクションしたときに doPost のログが表示されれば Event Subscriptions の設定は問題ありません
表示 -> Stackdriver Logging -> Apps Script ダッシュボードを開いてフィルタをクリアをクリックすると下記のように doPost が呼ばれていることが確認できます。

reactions.add APIが機能しているかわからない

reactions.add API でトークンや他のパラメータの設定などが正しいのか？となり調べてみると私の場合はこの設定が良くなかったみたいです

とりあえず GAS とは別で API を試してみるのが良さそうです。リアクション追加の API に必要なのは下記パラメーターです。

• token: アクセストークン
• channel: 投稿するチャンネルID
• timestamp: 投稿した時刻
• name: 追加するリアクション

必要なパラメータを取得するため Slack で適当なメッセージのリンクをコピーします。URLは下記のようになっているはずです。

https://[ワークススペース名].slack.com/archives/[チャンネルID]/p[投稿時刻]

「投稿時刻」はエポックマイクロ秒で記載されており、これを小数点付きのエポック秒に変換する必要があるようです。

ex. 1234567890123456 => 1234567890.123456

※ 参考：[Slack]API経由でreaction (add emoji)

ターミナルで下記コマンドを実行し、指定のメッセージにゴリラリアクションがつけば成功です

curl -X POST 'https://slack.com/api/reactions.add?token=xxxx-xxxxxxxxx-xxxx&channel=[チャンネルID]&timestamp=[投稿時刻]&name=gorilla'

パラメータは JSON で送信するのかと思ったらクエリストリングじゃないとエラーになるようでした。。。

エラー色々

• missing_charset: パラメータをJSONで送っているなど
• channel_not_found: チャンネルにアプリ追加していないなど
• not_authed: トークンが違うなど

詳しくはドキュメント https://api.slack.com/methods/reactions.addをどうぞ

おまけ

下記記事を参考にすると簡単にオリジナルコマンドが作成できます！
Slash CommandsとGASでSlackのオリジナルコマンドをつくる

わたしは /punch で約 100 種類のパンチが打てるコマンドを作成しました！！

さいごに

GAS を使うと気軽にSlackで遊べるので大変良いです
みんなも GAS と Slack で遊ぼう！
（Twitterの埋め込みをやってみたかった）

参考

• Slackで特定のスタンプ(リアクション)に反応するサーバレスボットをGASで作成してみた
• [Slack]API経由でreaction (add emoji)