Google Apps Script：Slackチャンネルログ

今回は、SlackAPIを使用して資料共有チャンネルのURLを一覧で取得していく準備をしていきます。友人のエンジニアと勉強会用のSlackを運営しているのですが、いい感じに共有の流れができているのでデータ収集をGASを用いてSlackボットで実装していきたいと思います。

どもども！新しく勉強が始まる隙間時間を活用するシリーズです。まぁ思ったよりも実装に時間がかかる場合もあるんですが、今回はさくっとできました。早朝に軽めのデプロイを終えてボケーっとしている龍ちゃんです。とかぽけーっと思っていたら未消化のタスクがあったことに気づき終わらせてきました。

さて！今週は回復期ということで、ゆっくりと仕事をしていく気分だったのですが絶妙に忙しかったです。でも、ブログを書く時間は確保するか確保しないかという心持次第だけですね。もう数日すると新卒のメンバーも入ってくるので、ブログは継続の意思を発信しておくべきだと思います。

今回は、必要だから作成しました。必要なものはシンプルなものだったというものは往々にしてあるものです。背景としては以下になります。

最近、社外の数名のエンジニアと社内のエンジニアを一つのSlackに入れて勉強会を開いています。勉強会といってもスキルスタックもバラバラなので、Google Meetを開いて好きに勉強しています。悩みの共有や情報交換といった側面が強いです。そこで、資料共有とチャンネルを作成して、気になる資料や有用だと感じたリンクをぶん投げています。このチャンネルが思いのほか、軌道に乗っているので今後のためにGoogle Sheetでリンクだけを抽出したい。

こんな感じの背景と同期になります。しれ～っと要件定義まで行っていますね。ちなみに資料共有のSlackはこんな感じです。

背景でも触れましたけど、スキルスタックがバラバラなので共有される記事もバラバラです。ゆくゆくは記事の分類もしたいのですが、今回はデータ収集だけにしておきます。イメージはこんな感じです。本命は『SlackAPI』ですね。今回もさくっと作るためにGASを使用しています。

GASの技能的な部分に関してはこちらでまとめています。

• Google Apps Script 導入 初心者向け
• Google Apps Scriptを最大限活用していきたいなぁ～
• Google Apps Script スプレッドシート編　初心者向け
• いまさらGASでLineBotを作る【Drive画像保存・キュー処理】

Google Sheetの使用方法と基本的なルールの部分とスクリプトプロパティの使用方法あたりが関係します。あとはJsonのデータをどう成型するかとかですね。それでは初めて行きましょう。

事前準備

事前準備でわかりやすい資料を見つけたのでおいておきます。

• Slack Appの作り方を丁寧に残す【BotとEvent APIの設定編】

画像多めですごくわかりやすかったです。基本はこのサイトを見てもらえれば初期セットアップはできると思うので、SlackAPIの公式サイトをいったん探検してみてください。

できればアプリの作成まで行っておきましょう。ついでにワークスペースにまで追加できればとても良いです。

実装

今回設定していくものは以下になります。

• Google Sheet：ログを保存場所
• GAS：Slack APIからの受け皿
• Slack App：アプリの基本設定と認証情報

今回は、先にコーディング（メイン）を作成してからSlack Appのほうの設定を行っていきます。アプリの作成が終了しているものとして話を進めていきます。わかりにくいところは画像を置いておくので、頑張って探してください。

環境変数の取得

まずは、保存場所としてGoogle Sheetを作成しましょう。適当なファイルを作成して「Sheet Name」をlogと設定してください。URL部分の「File ID」をメモしておきましょう。あとで使用します。

次に必要な部分はSlack App側の情報になります。Slack API側のページに飛んでアプリを作成して以下のページまで飛んでください。「Basic Information」のページをしたまでスクロールしてください。

スクロールして以下の画面の赤枠の部分の値をコピーしておいてください。

これで以下の値がそろったと思います。

• Google Sheetの「FileID」
• Slack Appの「Verification Token」

これらの値をGASのスクリプトプロパティとして設定していきましょう。命名はコーディングの時に一致していれば問題ないので、好きに命名してください。今回は「TOKEN」と「FILE_ID」という命名にしました。

スクリプトプロパティの設定方法がわからない場合は、こちらのブログを参照してください。

コーディング

それではコーディングに入りましょう。といっても以下のファイルをコピペして「全員」を対象に「WEBアプリ」として実行するだけです。内容としては二つの機能を持っています。

• Slack Events APIを登録するための仕組み
• 本筋のチャンネルの情報をGoogle Sheetに書き込む仕組み

function doPost(e) {
  // slackは五秒以内に返答を返さないとエラー扱い
  const json = JSON.parse(e.postData.contents);

	// スクリプトプロパティから検証用のトークンを取得する
  const TOKEN = PropertiesService.getScriptProperties().getProperty("TOKEN");

  // アクセスがSlackからでなければエラー
  if (TOKEN != json.token) {
    throw new Error("invalid token.");
  }

  // Slackに受け取り用URLを検証するためのチャレンジ
  // <https://api.slack.com/events/url_verification>
  if (json.type == "url_verification") {
    return ContentService.createTextOutput(json.challenge);
  }

  if (json.type == "event_callback") {
    writeSheet(json.event.text)
  }

}

// Slackのチャンネルに来たメッセージスプレッドシートに転記する
const writeSheet = (text) => {
  const FILE_ID = PropertiesService.getScriptProperties().getProperty("FILE_ID");
  const file = SpreadsheetApp.openById(FILE_ID)
  const sheet = file.getSheetByName("log")
  const lastRow = sheet.getLastRow()
  sheet.getRange(lastRow + 1, 1).setValue(text)
}

公開時のURLはちゃんとメモを取っておいてください。あとで必要になります。

Slack App側の設定

ここが一番厄介です。Slack APIの「Event Subscriptions」を有効にして、Request URLに先ほどのURLを記入してください。ここでエラーが出たらうまく情報が設定できていないのでコピペをもう一度トライするか、連絡をいただければ幸いです。

次にBotの権限を調整したいと思います。今回設定するのはBotが入っているパブリックチャンネルのメッセージを取得したいので「message.Channels」を設定します。

設定を反映したら完了です。

終わりに

結果としてこんな感じに表示されていれば成功です。

一つ問題があるのですが、来た情報をいい感じに成型する必要があります。あくまで情報収集を目的としていたので、送ってきたメッセージをそのまま取得しています。ここからURLだけをええ感じに成型していくしかないですね。既存のプラットフォームを使うことで、フロント画面を作らなくてもデータ収集のみは実装できるのが良い点ですね。

今後はこの情報をええ感じに活用する方法を考えていきたいと思います。ほなまた～