Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

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

Slide 3

Slide 3 text

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

Slide 4

Slide 4 text

主なイベント登壇 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」~

Slide 5

Slide 5 text

テーマ 5 Block Kit Builderを使おう

Slide 6

Slide 6 text

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

Slide 7

Slide 7 text

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

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

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

Slide 11

Slide 11 text

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

Slide 12

Slide 12 text

12 Let’s Try

Slide 13

Slide 13 text

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通知処理の分割

Slide 14

Slide 14 text

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通知処理の分割

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

Block Kit 16 勤怠アプリ

Slide 17

Slide 17 text

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

Slide 18

Slide 18 text

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

Slide 19

Slide 19 text

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

Slide 20

Slide 20 text

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

Slide 21

Slide 21 text

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]); }

Slide 22

Slide 22 text

Demo 22

Slide 23

Slide 23 text

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

Slide 24

Slide 24 text

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

Slide 25

Slide 25 text

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

Slide 26

Slide 26 text

Appendix 26

Slide 27

Slide 27 text

27 Google Slides

Slide 28

Slide 28 text

End Of File 28