SlackのapiでGoogleフォームのメッセージ送信をGoogleAppsScriptで行う方法

Googleフォームに回答した内容を手動で共有しているときに「自動化できないかな？」と思うことはありませんか？今回は情報共有の業務効率化としてGoogleフォームの回答内容をSlack。

Contents

1 今回やりたい事：Googleフォームの送信結果をSlackのチャンネルに自動送信
2 Googleフォームの送信結果をGASからslackのAPIでメッセージを送る手順
3 Slackのアプリを作成してインストールする
4 Slackチャンネルにアプリをメンバーに加える
5 GoogleAppsScriptでGoogleフォームの結果をSlackチャンネルにメッセージを送る

今回やりたい事：Googleフォームの送信結果をSlackのチャンネルに自動送信

Googleフォームの入力結果をメールやスプレッドシートに貯めるだけでなく、フォーム解答時にSlackにも共有したい時はSlackのAPIを使うことで実現可能です。今回はGoogleフォームの回答結果をGoogle Apps Scriptを使ってSlackのチャンネルに自動送信する方法を共有します。

Googleフォームの送信結果をGASからslackのAPIでメッセージを送る手順

ここでは手順の流れを説明します。尚、今回は「Googleフォーム」と「Slackチャンネル」は既に作成されている状態として説明をしますので、作成されていない方は準備しておいてください。

事前準備

「Googleフォーム」と「Slackチャンネル」は事前に作っておきましょう

Googleフォームの送信結果をGASからslackのAPIでメッセージを送る手順は、以下の流れが必要です。

Slackのアプリを作成してインストールする
Slackチャンネルにアプリをメンバーに加える
GoogleAppsScriptでGoogleフォームの結果をSlackチャンネルにメッセージを送る

それぞれの手順を以下で説明していきます。

Slackのアプリを作成してインストールする

Slack APIのヘルプページに遷移する

まずはGoogle検索で「Slack API」を検索してヘルプページに行きましょう。サイトを表示したら左メニューの「Messaging」のメニュー内の「Send or schedule a message」をクリックして表示します。

表示したヘルプページは、SlackAPIでメッセージを送信する手順が記載されていますので、時間がある人は見てみましょう。

Slackのアプリを作成する（1.Creating an app）

ヘルプページの「1.Creating an app」の「Go to Your Apps」をクリックしてSlackのアプリ作成ページに遷移します。遷移したページの「Create an App」をクリックしてアプリを作成します。

「From scratch」を選び、アプリの名前（App Name）入力とワークスペースを選択（Pick a WorkSpace to develop your app in）して「Create App」をクリックして作成します。

選択するワークスペースについて

事前にワークスペースは作成しておきましょう。また、連携したいワークスペースがない場合は、連携を行いたい正しいSlackにログインしているかを確認しましょう。

作成が完了すると、作成したアプリページに遷移します。

作成したアプリの権限を設定する（2.Requesting scopes）

作成したアプリのページに遷移したら、アプリの権限を設定します。アプリの権限では、アプリで「メッセージを送信する」ための権限を付与してあげます。

アプリのBasic information」ページでスクロールを行い「Permissions」をクリックして権限設定ページを行います。「Permissions」ページに遷移したら「Scopes」までスクロールを行い、「Bot Token Scopes」にある「Add an OAuth Scope」をクリックします。「chat:write」と「channels:read」をアプリでできるように設定します。

権限設定を行ったらアプリページの「App Home」からスクロールして「Your App’s Presence in Slack」の「App Display Name」の横にある「Edit」をクリックして名前を設定します。

「App Display Name」を設定しないとエラーが出る場合があるので、設定を省略しないようにしましょう。

アプリをインストールする（3.Installing and authorizing the app）

アプリの権限設定を行ったら、インストールします。アプリページの「Basic Information」から「Install to Workspace」をクリックしてインストールを行います。クリックした後に表示された画面で、作成したアプリとインストール先のワークスペースに間違いがないことを確認して「許可する」をクリックします。成功していたら「Install your app」の右にチェックマークがあることを確認します。

アプリの基本情報で「Verification Token」は、GoogleAppsScriptからメッセージを送信するときの認証情報として使いますので、コードを作成するときのために保存しておきましょう

インストールに問題がなければ、Slackワークスペースの「App」にインストールしたアプリが表示されます。（表示されない場合は、「＋」ボタンからアプリ名を検索してみましょう。

Slackチャンネルにアプリをメンバーに加える

連携するSlackのチャンネルを開きます。上部のチャンネル名をクリックしてチャンネルの設定画面を表示します。

設定画面のメニュー「インテグレーション」をクリックしたら、画面真ん中の「App」にある「アプリを追加する」をクリックします。クリックして表示される画面から、作成したSlackアプリを選択します。

これでSlack側の設定関連が終了しました。

Googleフォームの送信内容をGoogleAppsScriptからSlackのチャンネルに送信するコードを記述します。

GoogleAppsScriptでGoogleフォームの結果をSlackチャンネルにメッセージを送る

既にGoogleフォームは存在している前提ですので、Googleフォームが未作成の場合は作成しましょう。Gogleフォームの作成ができたら編集権限を持つGoogleアカウントでGoogleフォームを表示します。

Googleフォームと連動するGoogleAppsScriptのエディターを表示する

編集権限を持つGoogleアカウントでフォームを開いたら、縦の三点リーダのメニューから「スクリプトエディタ」をクリックします。この操作によって、Googleフォームと連動したGoogleAppsScriptの記述が可能になります。

Googleフォームと連動するGoogleAppsScriptのソースコード

スクリプトエディタを開いたら、以下のコードをコピペします。

スクリプトエディタに表示されている「function myFunction() {}」の部分は使用しないので削除していただいて問題ないです。削除した上で以下のコードをコピペしてください。

function onFormSubmit(e){
  const formResponse = e.response;
  const itemResponses = formResponse.getItemResponses();

  let message = '新しいTシャツ購入がありました。\n===========\n'

  itemResponses.forEach(itemResponse=>{
    const question = itemResponse.getItem().getTitle()
    const answer = itemResponse.getResponse();
    message += `${question}:${answer}\n`;
  })
  message += "===========\n皆さんの迅速な対応にいつも感謝( ´ ▽ ` )"

  sendMessageToSlack(message)
  Logger.log(message);



}
function sendMessageToSlack(message) {
  const scriptProperties = PropertiesService.getScriptProperties();
  const accessToken = scriptProperties.getProperty('###Slackのアプリ作成時に発行されたアクセストークンを記述する###');
  const channelID = '###slackのChannelIDをここに記述する###';
  const endpoint = 'https://slack.com/api/chat.postMessage';

  const payload = {
    'channel':channelID,
    'text':message
  }

  const options = {
    'method':'post',
    'headers':{
      'Authorization':`Bearer ${accessToken}`,
      'Content-Type':'application/json'
    },
    'payload':JSON.stringify(payload)
  };

  const res = UrlFetchApp.fetch(endpoint,options);

}

function onFormSubmit(e){

const formResponse = e.response;

const itemResponses = formResponse.getItemResponses();

let message = '新しいTシャツ購入がありました。\n===========\n'

itemResponses.forEach(itemResponse=>{

const question = itemResponse.getItem().getTitle()

const answer = itemResponse.getResponse();

message += `${question}:${answer}\n`;

})

message += "===========\n皆さんの迅速な対応にいつも感謝( ´ ▽ ` )"

sendMessageToSlack(message)

Logger.log(message);

}

function sendMessageToSlack(message) {

const scriptProperties = PropertiesService.getScriptProperties();

const accessToken = scriptProperties.getProperty('###Slackのアプリ作成時に発行されたアクセストークンを記述する###');

const channelID = '###slackのChannelIDをここに記述する###';

const endpoint = 'https://slack.com/api/chat.postMessage';

const payload = {

'channel':channelID,

'text':message

}

const options = {

'method':'post',

'headers':{

'Authorization':`Bearer ${accessToken}`,

'Content-Type':'application/json'

'payload':JSON.stringify(payload)

};

const res = UrlFetchApp.fetch(endpoint,options);

}

コピペを行ったら、コード22行目に既に作成したSlackアプリのアクセストークンを記述して、さらに23行目にGoogleフォームの入力内容を送信するSlackのチャンネルIDを記述します。

channelIDの確認方法

チャンネルの詳細を開きます。

チャンネルの詳細情報が表示された画面下部の英数字が「チャンネル ID」

Slackアプリのアクセストークンの確認方法

SlackAPIページから既に作成したSlackアプリを選択して、メニュー「Basic Information」をクリック
表示されたページをスクロールして「Verification Token」に記述されている英数字がアクセストークン

（一度だけ）ソースの保存を行い「実行」の権限「許可」を行う

ソースコードの記述が完了したら、ctrl+sで保存を行います。保存したら「実行」を押します。

「実行」後に、上記画面が表示されたら「権限を確認」をクリックします。

上記画面が表示されたら「詳細を表示」をクリック、そして「xxxxx（安全ではないページに移動）」を更にクリックします。

上記画面が表示されたら「許可」を行います。これで問題なくエラーが表示されなければ完了です。エラーがある場合はGoogleAppsScriptの画面にエラーが表示されます。

動作の確認

これで設定に問題がなければ、Googleフォームに回答した内容がSlackのチャンネルに投稿されるようになります。情報共有の業務効率化として試してみてください。今回のようにSlackだけでなく、Chatworkに共有することもできます。手作業で行なっている作業を自動化する事で業務効率化ができますので、ぜひトライしてみてください。