20220706_Google Apps Scriptを実演で学ぶ～ GAS × Slack ～

Transcript

1. 2021/07/06
   1
   ※ 本内容は個人的な見解であり、所属する組織と関係ありません。
   Google Apps Script
   を実演で学ぶ
   ～ GAS × Slack ～
   Block Kit Builderを使おう
   

   View Slide

2. 自己紹介
   あぱchan
   @ApachanHonpo
   埼玉県戸田市
   宮城県仙台市
   業務効率化のお仕事
   2
   2021年
   11月
   WinActor
   トーク
   6ヵ月20kg減
   

   View Slide

3. 執筆書籍
   3
   徹底解説 RPAツールWinActor導入
   ・応用 完全ガイド
   絶対失敗しない！ロボット1000体
   導入してわかったRPA成功の秘訣
   Google Apps Script目的別リファ
   レンス実践サンプルコード付き
   需要のある技術を中心に出版社に提案
   第3版
   2021/3
   発売
   第1版
   2020/5
   発売
   第1版
   2020/8
   発売
   Google Apps Script目的別リファ
   レンス実践サンプルコード付き
   第2版
   2022/5
   新発売
   

   View Slide

4. 主なイベント登壇
   4
   RPA Community
   Google Apps Script の特徴・利用のきっかけ
   必要な情報をメールから取得する方法
   TechStreet
   vol.1 2021/07
   vol.2 2021/11
   vol.3 2022/04
   2022/7/6
   Google Apps Scriptを実演で学ぶ～「GAS×Slack」
   ＆「GAS×Notion」～
   

   View Slide

5. テーマ
   5
   Block Kit Builderを使おう
   

   View Slide

6. 6
   Block Kit
   クリーンで一貫性のあるUIフレームワーク
   https://api.slack.com/block-kit
   

   View Slide

7. 7
   Block Kit Builder
   画面操作でUIを作成
   UI選択 UI反映 編集
   ※ ワークスペースへのサインイン必須
   

   View Slide

8. 8
   今回のデモ
   ① Slackチャンネルに通知
   GAS
   プロジェクト
   Slack
   チャンネル
   ② Slackチャンネルからの通信（参考）
   

   View Slide

9. 9
   ワークフロー① 難易度：易
   Slackチャンネルに通知
   GAS
   プロジェクト
   Slack
   チャンネル
   

   View Slide

10. 10
    Incoming Webhook
    パターン 利用可能プラン 説明
    カスタムインテグレー
    ション
    全プラン かんたんに設定できますが、現在Slack社より非推奨
    とされています。
    SlackApp 全プラン やや複雑ですが手順がわかれば利用自体は難しくあ
    りません。
    ワークフロービルダー スタンダード以上
    ※ フリープラン不
    可
    かんたんに設定できますが、フリープランでは利用
    できません。テキストにメンションやハイパーリン
    ク文字列など入れることができません。
    ※ レスポンスが必要な場合はAPI利用
    

    View Slide

11. 11
    Slack App
    https://api.slack.com/apps
    Webhook URLの取得
    ※ 無償版のアプリ作成は10個迄
    

    View Slide

12. 12
    Let’s Try
    

    View Slide

13. 13
    前提
    function sendSlackMessage_
    (url, data) {
    const params = {
    method: 'post',
    contentType: 'application/json'
    ,
    payload: JSON.stringify(data)
    };
    const res = UrlFetchApp.fetch(url, params);
    return res;
    }
    スクリプトプロパティの活用 Slack通知処理の分割
    

    View Slide

14. 14
    コーディング
    const PROPS = PropertiesService.getScriptProperties();
    function gasToSlack() {
    const webhook = PROPS.getProperty('webhook');
    console.log(webhook);
    const data = {
    // Bloclk Kit コード 貼り付け
    };
    const response = sendSlackMessage_(webhook, data);
    Logger.log(response);
    }
    スクリプトプロパティ
    Slack通知処理の分割
    

    View Slide

15. Slack
    チャンネル
    15
    ワークフロー➁ 難易度：中～高
    Slackチャンネルからの通信
    GAS
    プロジェクト
    デプロイなど各種設定、
    doPost()、GCP...など
    

    View Slide

16. Block Kit
    16
    勤怠アプリ
    

    View Slide

17. 17
    GAS側 Webアプリ
    HTTPリクエストの取得
    発動する関数
    doPost(e)
    

    View Slide

18. 18
    Slack側 エンドポイント
    SlackからGASの通信設定
    

    View Slide

19. Code Slackからのリクエスト取得
    19
    function doPost(e) {
    console.log(e);
    Logger.log(e);
    // 意図的にエラー 宣言してない変数
    name
    }
    

    View Slide

20. ログの比較
    20
    GAS
    GCP
    何もなし
    ログ参照
    

    View Slide

21. Code シートへの書き出し
    21
    function doPost(e) {
    const payload = JSON.parse(e['parameter']['payload']);
    const ssId = PROPS.getProperty('SSID');
    const sh = SpreadsheetApp.openById(ssId).getSheets()[0];
    sh.appendRow([payload]);
    }
    

    View Slide

22. Demo
    22
    

    View Slide

23. 課題のまとめ
    23
    ① doPost(e)
    GASのプロジェクトからログが参照できません
    GCPに連携してロギングを参照するか、スプレッドシートなどに書き出す必要あり
    ② JSON解析
    階層が深い...リファレンスを見た方が良いのかも...
    ③ デプロイ
    Slackからの通信のため「テストのデプロイ」が利用できません
    コードが変わる度にデプロイの必要あり
    ④ 非同期通信
    UI入力毎に通信が走る
    おそらく同期処理にできるはず...
    ⑤ 例外処理の設定
    想定外のリクエストの処理
    

    View Slide

24. ① doPost(e) GCPのロギング
    24
    ログの参照
    

    View Slide

25. ② JSON解析 e['parameter']['payload']
    25
    登録ボタンの判定
    ユーザーの取得
    入力内容の取得
    

    View Slide

26. Appendix
    26
    

    View Slide

27. 27
    Google Slides
    

    View Slide

28. End Of File
    28
    

    View Slide