GASでslackゴミ出し抽選botを作成する(設定編)

#本記事について
備忘のため、slackにGASで作成したBotを追加する際の手順の記録に重きを置いています。
GASに限らず、slackのbotを作る際に設定場所の参考として役立てて頂けると幸いです。
botのコードの処理内容に関しては[コード解説編](https://qiita.com/marogoma/items/797d871c7f65dfdeb2e4)をご覧下さい。

##botの動き

毎日定刻にslackの「特定のチャンネルに属するメンバーから1名」をランダムに選択し、ゴミ出しを促すメッセージを投稿するbotをGAS(GoogleAppsScript)を用いて作成します。
![スクリーンショット 2019-06-09 17.55.54.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/472f1d5b-8a19-cbaa-f4f4-3300cd26f782.png)

- 「完了しました」ボタンを押した場合は元の抽選投稿が「ありがとうございましたメッセージ」にupdateされる
![スクリーンショット 2019-06-09 17.56.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/068b9f21-d8e7-b9d6-d7d2-4b8a12d31e17.png)

- 一定時刻までに完了報告がされない場合は、リマインド投稿がされます。
![スクリーンショット 2019-06-09 18.07.16.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/1ccba0c2-1c67-e5d5-caf7-cdb60d6de519.png)

- メッセージにはinteractiveな再抽選実行のボタンがついており([参考:slack interactive messagesリファレンス](https://api.slack.com/interactive-messages))、
再抽選の理由を入力するダイアログが出現し、入力された理由が投稿＆再度抽選が実行されます。
![スクリーンショット 2019-06-09 17.58.52.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/862297d2-2c9c-68c0-fda4-31ece97cd2c2.png)

- 抽選実施日が祝日か否かを判定し、祝日には抽選投稿が実施されないようにする。

- 再抽選で「同じ人が再び当選する」ことを防ぐために、最新の当選者は抽選から除外されます。

#実装手順

##1. slack appの初期設定
###1-1.app新規作成
https://api.slack.com/apps にアクセスし、Create New Appを押す。
![create new app.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/4019be73-96d2-b1d7-299e-6925fac59479.png)

###1-2.app名称設定
Create a Slack Appというダイアログが表示されるので、
![スクリーンショット 2019-06-09 15.36.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/fff7c920-f3e1-8a33-975a-0032d326910e.png)
・App Nameに任意の名前を入力
・Development Slack Workspaceはプルダウンからworkspaceを選択
・右下のCreate Appを押す。


###1-3.権限付与
Basic Information→Add features and functionality
→Permissions→OAuth&Permissionsの画面に遷移
→Scopesの項目内のSelect Permission Scopesで
　・Access information about user's public channels
　・Send messages as (App name)
の２つの権限を追加し、Save Changesを押す。
![スクリーンショット 2019-06-09 15.42.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/4d130fcb-0ee1-922f-4473-a19443ddb42c.png)

###1-4.workspaceに追加・OAuth token取得
画面上部にスクロールし、Install App to Workspaceを押す。
![スクリーンショット 2019-06-09 15.34.08.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/7e414655-aa87-ebd7-7022-90ac38e8c63f.png)
確認画面が出るのでInstallを押す。
![スクリーンショット 2019-06-09 15.48.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/2141ddce-e900-cd3f-62d3-9f31581e0c93.png)
OAuth Access Tokenが表示されるので、この値をメモしておく。
![スクリーンショット 2019-06-09 15.51.25.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/41e1903d-8c96-f656-6834-da5d43e59c8f.png)


##2. GASの設定
Googleドキュメントを新規に作成し、ツール→スクリプトエディタを押してスクリプトエディタを開く。
![スクリーンショット 2019-06-09 16.01.14.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/54a134d1-c0f4-b27d-a3e4-7984f2d67bd4.png)

###2-1.GASライブラリ追加
リソース→ライブラリから
「Moment.js (MHMchiX6c1bwSqGM1PZiW_PxhMjh3Sh48)」
「SlackApp (M3W5Ut3Q39AaIwLquryEPMwV62A3znfOO)」
の２つのライブラリを追加する。
(追加手順は[外部サイト:いつも隣にITのお仕事](https://tonari-it.com/gas-moment-js-moment/) 及び [Slack BotをGASでいい感じで書くためのライブラリを作った](https://qiita.com/soundTricker/items/43267609a870fc9c7453) を参照)
![スクリーンショット 2019-06-09 16.13.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/1bea4730-8200-b31a-a6d7-4446a05edd22.png)

###2-2.GASアプリケーション公開
ここまででGASはライブラリを追加したのみで処理を1文字も書いていませんが、slackに設定するアドレスを取得するため公開します。
スクリプトエディタ上部の公開→「ウェブアプリケーションとして導入」を押す。
![スクリーンショット 2019-06-09 16.17.36.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/e270f1ca-2628-b134-5fe7-876af3e2bd5c.png)
アプリケーションにアクセスできるユーザーを「全員（匿名ユーザーを含む）」に変更して、導入を押す。
許可を確認するダイアログが出ますが、許可して進めて行きます。
公開が完了すると「現在のウェブアプリケーションのURL」が表示されるのでこのURLをメモします。
![スクリーンショット 2019-06-09 16.18.13.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/e3a2637e-8276-4cac-f1d5-4e5aa2b0806e.png)

##3. 再度Slackの設定
https://api.slack.com/apps にアクセスし、手順1で作成したappを開きます。
###3-1.slackからPOSTする先のURL設定
BasicInformation→Add features and functionality
→Interactive Componentsと進み、Interactivityをonにします。
するとRequestURLを入力するフォームが出現するので、2-2.で取得したURLを入力します。
![スクリーンショット 2019-06-09 16.36.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/16d38996-d5af-fc5e-1470-47b9c8c7ca1d.png)
フォームにURLを入力してエンターキーを押すと(←重要)画面右下のSaveChangesボタンがアクティブになるので、押す。

###3-2. VerificationTokenの取得
appのBasicInformation→AppCredential内の、
VerificationTokenの値をメモします。

##4. 再度GASの設定
Googleスプレッドシートからスクリプトエディタを開きます。
###4-1. tokenの登録
画面左上のファイル→プロジェクトのプロパティを押す。
「スクリプトのプロパティ」タブに、
プロパティ→　OAuth_token　　 値→ 1-4.で取得したOAuth tokenの値
プロパティ→　verified_token 値→　3-2.で取得したVerification tokenの値
という２行を追加して保存します。(プロパティ名はあくまで一例です)
![スクリーンショット 2019-06-09 16.48.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/2199b667-2a4b-dd27-65df-a79311675377.png)

###4-2. コード追加
スクリプトエディタのコード.gsに下記githubリンクのコードを貼り付けます。
[githubリンク](https://github.com/marozex/myGas/blob/master/gomibot/gomibot.gs)
必ず、1行目の `channelId` の値を実際に抽選を実行するslackのチャンネルIDに書き換えて下さい。
※channelIDはブラウザで対象のチャンネルを開いた際のアドレスが、
`https://{{workspace名}}.slack.com/messages/{{channelID}}/`
なので{{channelID}}の部分の値を使う。

###4-3. スクリプト更新
左上のファイル→版を管理→
・テキストエリアにコメントを記入
・新しいバージョンを保存を押す
→ダイアログ下部のOKを押す。
![スクリーンショット 2019-06-09 17.00.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/6537870c-c917-8d70-be5d-14cbf12f677d.png)

###4-4. 公開版更新
公開→ウェブアプリケーションとして導入→プロジェクトバージョンを最新のものにして、ダイアログ下部の「更新」を押す。
![スクリーンショット 2019-06-09 17.04.00.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/13b55ab7-4d80-c16c-dd55-f8a13aa43e42.png)

###4-5. トリガー追加
編集→現在のプロジェクトのトリガー→画面右下の「トリガーを追加」
→下記画像のように午前8時〜９時に関数が実行されるように登録。
![スクリーンショット 2019-06-09 17.47.45.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/225823/f5c0919a-fcf7-c3ad-e1c2-0726f2310d5b.png)

以上となります。