Googleフォームで送信された回答をSlackのチャンネルに通知させる

今回はGoogleフォームで送信されたら、それをSlackに通知させるようなものを作っていきたい。以前にスプレッドシートに書き込んだり自動返信したりとかいったことはしたけど、通知関係何もやっていなかったね。

Slack通知するにあたってちょっとプログラム書いたりして面倒だけど、一度作ってしまうと後は勝手に通知してくれて便利なはずだからね。まあやっていこう。

Googleフォームの送信をSlackに通知させる手順

今回やろうとしているGogoleフォームで送信があったら、それをSlackに通知させるっていうことだけどやる手順はこんな感じでいこうと思う。

  1. Slackの設定
    1. 通知させるSlackチャンネルの作成
    2. Webhook URLの取得
  2. GoogleフォームからSlackに通知させるGASプログラムの作成

面倒なのはやっぱり最後のSlackに通知させるプログラムの作成っていうところだね。これはGoogle関連のサービスと相性の良いGAS(GoogleAppsScript)を使ってやっていきたいと思います。GAS使ったGoogleフォームの自動返信なんかは前やったね。

こんな感じでプログラムを書いてGoogleフォームで送信されたら、Slackに通知させるようにしていきたい。とりあえず最初のSlackの設定からやっていこう。

Slackの設定

まずはSlackの設定から。ここでは以下の2つをやっていこう。

  1. 通知させるSlackチャンネルの作成
  2. Webhook URLの取得

まずはチャンネルを作成するところからだ。

Googleフォームの送信を通知させるSlackチャンネルの作成

Slackのチャンネルを作るのは容易い。web版なら左側から[チャンネルを追加する]をクリックして[新しいチャンネルを作成する]から名前や説明を入れて[作成]しよう。

通知するチャンネルが出来上がったら次はWebhook URLの取得だ。

Webhook URLの取得をする

Webhookの取得をやっていくんだけど、Webhookってなんだよ?うん??っていう感じですよね。今回Slackに通知するということで、プログラムから通知することになるんだけど、その時にどこに通知を届けたらいいかプログラムは分からないですよね。(僕らは分かるけど・・)

そのプログラムにここに通知してね!っていう指定をするためにこのWebhook URLっていうのが必要になってくる。取得自体は簡単だからやっていこう。

Slackに左下にある[アプリを追加する]から[Incoming WebHooks]っていうのをクリック。

[設定]から設定画面に進もう。

そしたらブラウザで設定画面が開くと思うから、そこからWebhook URLを取得だ!

このWebhook URLは後で使うからコピーしておきましょ。これでSlack側の設定は完了。次はプログラムの記述をしていきますよ。

GoogleフォームからSlackに通知させるGASプログラムの作成

作成したGoogleフォーム

Slack通知のプログラムを書く前に今回使うフォームはこれ。Googleフォームのサンプルにあるやつそのまんま。

 

このフォームから送信されたらSlackに通知するためのGASを書く。右上から[スクリプトエディタ]を選択してGASの画面に進もう。

そしたらここにSlackに通知させるためのコードを書いていく。

const getInputs = responses => {
  let inputs = []
  responses.forEach(res => {
    inputs.push({
      title: res.getItem().getTitle(),
      response: res.getResponse()
    })
  })
  
  return inputs
}

const createMessages = inputs => {
  let body = ""
  inputs.forEach(input => {
    body += "■" + input.title
      + "\n\n"
      + input.response
      + "\n\n"
  })

  return body
}

const sendToSlack = (messages, channel) => {
  let url = "取得したSlackのWebhook URL";
  let data = { 
    "channel" : channel,
    "username" : "Googleフォーム送信通知",
    "attachments": [{
      "title": "Googleフォームからの送信がありました。",
      "text" : messages,
    }],
  };
  let payload = JSON.stringify(data);
  let options = {
    "method" : "POST",
    "contentType" : "application/json",
    "payload" : payload
  };

  UrlFetchApp.fetch(url, options);
}

const onFormSubmit = e => {
  const inputs = getInputs(e.response.getItemResponses())
  const messages = createMessages(inputs)
  sendToSlack(messages, "通知したいSlackのチャンネル名");
}

とりあえず適当にそれっぽいものを記述。記述したら、フォームが送信されたらこのプログラムを動かして通知させるためにトリガーっていうやつを設定していく。左側にある時計のマークからやっていこう。

上記のような感じでフォーム送信時を指定して保存!そしたらGoogleフォームから適当に入力して送信してみると・・・良い感じにGoogleフォームの回答結果がSlackに通知されてきましたね。

コードの部分は以下を変更してみると動くんじゃないかなーって思います。

  • let url = "取得したSlackのWebhook URL";
  • sendToSlack(messages, "通知したいSlackのチャンネル名");

良い感じのコードにしちゃってください(JavaScriptっぽく書いてもGAS動くんだね・・・)

いちいちGoogleフォームの結果確認しにいかなくても、うまいこと通知がくれば確認する必要ないから楽ですよね。ただエラーが起きた場合には通知が来ない場合があると思うから、その辺のハンドリングは考えた方が良さそうだね。

まとめ

Googleフォームから送信された結果をSlackに通知させるっていうことをやったけど、一度やってしまえば後は勝手に通知届けてくれるから楽ですよね。GASは自分で環境作る必要もないし、JavaScriptのノリで動くみたいだし使い勝手良いんじゃないでしょうか。

いちいちフォームから回答みにいくのが面倒だったりしたらやってみてもいいですね。

おすすめの記事