【GAS修行⑦】Googleフォーム連携の読書管理Slack BOT作成

・GAS熟練者への道。
・先人達のコードの「写経＆コピー」の駆使の成果物のまとめ。
・第七弾
・[第一弾](https://qiita.com/t_o_d/items/a29b4ba6eacad77b3690)・[第二弾](https://qiita.com/t_o_d/items/7dcc5637ab06996c8eaa)・[第三弾](https://qiita.com/t_o_d/items/8763b7e84bafc83caa5c)・[第四弾](https://qiita.com/t_o_d/items/eb03325f37e837de44ea)・[第五弾](https://qiita.com/t_o_d/items/75d9f10d674a096b3ab3)・[第六弾](https://qiita.com/t_o_d/items/2d4b62b8525309fcc0c4)はこちら。

## 経緯
・「七回目か。作れるものは大量にあれど、個人的に必要なアプリはそこまでないな。」
・「今回はスクレイピングではなくて、他のGoogle Apps連携のツールにしよう。」
・「決めた。これさえあれば、秒速で管理名誉職人ですな。」
→そういうわけで、今回もサンプルアプリと仏様サイトを発見。
https://qiita.com/pchan52/items/574e930a3cc42cf7f8b9
→「また参考（※マルコピ）に作るか。」
→取り組み開始。

## 概要
- Googleフォーム（読書アンケート）に回答すると、回答内容をSlcakに通知してくれる。  
→読書家として境地上げが可能。

## 結果
・実際の画面はこちらです。
![slack.PNG](https://qiita-image-store.s3.amazonaws.com/0/336499/7b93fa80-9c97-668f-883a-974928fab6ce.png)

## 作成環境
1. Google App Script
2. Incoming WebHooks  
※Slackがない場合は、一人用のSlackを開設しましょう。（何かと役に立つ。）

## 手順
### Google Apps Scriptの設定
-  GoogleドライブからGoogleフォームを起動。  
※Googleアカウントを持っていない人は、作成する。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/336499/ba0e8637-7d82-c20a-c0f5-1daef83aa0a6.png)
- Googleフォームの質問等を下記のように作成  
※自分の好きな内容でも良いが、これをベースにコードを書いていく。
![キャプチャ.PNG](https://qiita-image-store.s3.amazonaws.com/0/336499/2d5b3884-1d64-ac43-ff79-ad089e962eb7.png)
- フォーム作成後、これに紐づいたスクリプトエディタ起動。
    - フォームページ内の上部メニューの「点三つ」をクリックして、「スクリプトエディタ」をクリックして、起動。
![キャプチfdffdaャ.PNG](https://qiita-image-store.s3.amazonaws.com/0/336499/ba27669f-8067-531f-fde6-c631d0a4234c.png)
- 起動したプロジェクトに名前をつける  
※プロジェクト名が反映されるわけではないが、自分がわかる名前をつける。  
→保存。（最初の３行のままで良い。）
- 一旦置いておく。

### Slack Incoming WebHooksの設定  
- Incoming WebHooksのトークンを発行。
    - Slack内のアプリを追加したいチャンネルに行き、アプリ名をクリックして、「アプリを追加する」をクリック。
    ![image.png](https://qiita-image-store.s3.amazonaws.com/0/336499/697a089b-33ec-5188-b16f-578dce721a9c.png)  
    - 「Appディレクトリ」ページの検索欄に`web`と入力して、出てくる「Incoming WebHook」をクリック。
    ![image.png](https://qiita-image-store.s3.amazonaws.com/0/336499/a8904644-1b05-886a-fb16-bcd7427a0210.png)
    - Incoming WebHooksページの「設定を追加」をクリックして、下記の項目を確認。
        - 「チャンネルへの投稿」: チャンネル名
        - 「Webhook URL」: Incoming WebHooksのトークン
    ![df.png](https://qiita-image-store.s3.amazonaws.com/0/336499/27becf56-b880-c86e-f1dc-18045b056d92.png)
    - 確認後、「設定を保存」で保存して、Incoming WebHooks「トークン」をメモしておく。

### コード
- スクリプトエディタに戻り、下記のコードをコピーして、保存。
 
```JavaScript:slack-translate.gs
function sendToSlack(body, channel) {
  var url = "Incoming WebHooksのトークンを書く。";
  var data = { "channel" : channel, "username" : "ふぉーみんぐエンジェル", "text" : body, "icon_emoji" : ":grin:" };
  var payload = JSON.stringify(data);
  var options = {
    "method" : "POST",
    "contentType" : "application/json",
    "payload" : payload
  };
  var response = UrlFetchApp.fetch(url, options);
}

function test() {
  sendToSlack("テスト通知確認です", "#チャンネル名を書く");
}

function onFormSubmit(e){

  var body = "回答受諾。即刻確認せよ。\nさもなくば・・・・・（*'ω'*）\n"; 
  var applicant = "";
  var itemResponse = e.response.getItemResponses();

  for (var j = 0; j < itemResponse.length; j++){    
    var formData = itemResponse[j];
    var title = formData.getItem().getTitle();
    var response = formData.getResponse();

    // 質問内容と合わせる。（できるだけ短めに。）
    switch (title) {
      case "名前":
        name = response;
        break;
      case "タイトル":
        bookTitle = response;
        break;
      case "作者":
        author = response;
        break;
      case "ジャンル":
        genre = response;
        break;
      case "一言感想":
        impression = response;
        break;
      case "購入URL（任意）":
        buyUrl = response;
        break;
      default:
        break;
    }
  }
  var bodyPublic = 
      body + "「名前」 : " + name + "\n「タイトル」 : " + bookTitle + "\n「作者」 : " + author + "\n「ジャンル」 : " + genre + "\n「「一言感想」 : " + impression + "\n「URL」（Amazon等） : " + buyUrl;
  sendToSlack(bodyPublic, "#チャンネル名を書く");
}
```
 ※以下の項目を自分のものに変えるのを忘れない。
　　　・Incoming WebHooksのトークン（先程メモしたもの。）
　　　・Slackチャンネル名（test関数とonFormSubmit関数の中の２つ。）

- 自分のコードに書き換えて保存。
- 保存後、「test」関数を実行して、テストメッセージ通知確認。
    - スクリプトエディタ内の上部メニューの「関数名」の部分を「test」に変更して、二つ左の「▶」ボタンで実行。
- 通知確認後、フォーム押下の時にコードを実行してもらうために、トリガーを設定。  
    - スクリプトエディタのタブメニューの「編集」→ 「現在のプロジェクトのトリガー」をクリック。
    - トリガーを作成して、下記の画像のように設定。
![dsfsfafaf.PNG](https://qiita-image-store.s3.amazonaws.com/0/336499/d8555c23-f3bf-b602-648b-f9c0d7a62db2.png)
- 保存後、実際にフォームに回答して動作確認。
    - フォームページ内の上部メニューの「送信」ボタンをクリック。
    - フォーム送信設定ページ内の「クリップ」のボタンをクリックして、そこのURLをコピー。
    ![tempsnip.png](https://qiita-image-store.s3.amazonaws.com/0/336499/7b112d6b-bca5-974d-4b44-e4a071381172.png)
    - そこのURLにブラウザからアクセスすれば、実際のフォームに飛ぶので、回答する。
    - 回答後、送信する。
- 正常に動作すれば、完了。

## まとめ
- 今回は、Googleフォーム連携ということで、日程調整や軽いアンケートにも使えると実感。
- LINEへの応用も簡単だが、今回はSlackで作成したい衝動を抑えるつもりもなく、従順になる。
- これを見てくださるエンジニアの皆様、  
「そんなコードで満足してるとか、お前はまだまだ俺らのステージへは上がってこれなさそうだな。」とか  
「俺ならこれの何倍も簡単かつ効率的な管理ツール作れまっせ。」等の意見を何卒お待ちしております。

## 参考
- https://qiita.com/pchan52/items/574e930a3cc42cf7f8b9   
→このサイトを丸々参考（マルコピ）にしました。大変お世話になりました。