環境構築はいらないよ GASでサクッとbotをつくろう / 20171202 Creating Bot with GAS

2017/12/02 Cybozu Tech Conferenceの大阪LT資料です。
Google Apps Script(GAS)を使って、SlackやGoogle Spread Sheetと連携するbotをお手軽に体験するという内容です。

Transcript

1. 環境構築はいらないよ GASでサクッとbotをつくろう サイボウズ株式会社 チーム 鈴木 亜耶 (@szkayeah)
2. はなすひと ▌鈴木 亜耶 (@szkayeah)  サイボウズのエンジニア  今年1月に中途入社  好き：CI・自動化・自動テスト  チーム所属
3. おしながき ▌GASとは ▌やってみよう  用意するもの  動く・呼べる・渡せる・返ってくる ▌おわりに
4. GASとは
5. GASとは ▌Google Apps Scriptの通称(がす・ぎゃす) ▌環境構築なしですぐ書ける・動かせる ▌Googleの各サービスと容易に連携 ▌APIとして実行できる ▌定期実行できる
6. GASとは ▌ブラウザ上でコーディング
7. やってみよう 準備するもの
8. 用意するもの ▌今回はGASでGoogle Spread SheetとSlackを連携 ▌いるもの  Googleアカウント  Slackアカウント
9. やってみよう [動く]・呼べる・渡せる・返ってくる ↑
10. やること ▌GASを動かす Google Spread Sheet Google Apps Script データ登録 出典：https://slack.com/
11. Googleドライブでスプレッドシートを作成し開く
12. スプレッドシートIDを確認しスクリプトエディタを開く
13. エディタのmyFunction関数の中身を書いて保存
14. とりあえず4行！ function myFunction() { var sheet = SpreadsheetApp.openById(‘スプレッドシートID'); var lastRow = sheet.getLastRow(); var date = new Date(); sheet.getRange('A' + String(lastRow + 1)).setValue(date); }
15. 実行ボタンをぽちっとしてスプレッドシートへ
16. なんか入ってる！！！
17. Date型なので表示を変えれば時間も
18. やってみよう 動く・[呼べる]・渡せる・返ってくる ↑
19. やること ▌SlackからAPI化したGASを呼ぶ Google Spread Sheet Google Apps Script パラメータ なしで実行 データ登録 出典：https://slack.com/
20. Slackにログインして適当なチャンネルを作る
21. Appsへ
22. Outgoing WebHooksをインストール
23. Outgoing WebHooksの設定を保存 作ったチャンネルを選択
24. Outgoing WebHooksの設定を保存 この単語が含まれる Slack投稿でGASが実行される
25. Outgoing WebHooksの設定を保存 トークンをコピーして GASの方へ移動
26. doPost関数を作る function doPost(req) { // TokenCheck if (req.parameter.token != “Slackのトークン") { return; } myFunction(); } function myFunction() { var sheet = SpreadsheetApp.openById(‘スプレッドシートID'); var lastRow = sheet.getLastRow(); var date = new Date(); sheet.getRange('A' + String(lastRow + 1)).setValue(date); }
27. GASでウェブアプリケーションとして導入を選択
28. アクセスできるユーザーは匿名ユーザー含め全員に
29. 設定が完了するとURLが発行されるのでSlackへ
30. Outgoing WebHooksの設定でURLを入れて保存
31. あとはTrigger Wordを含むSlack投稿をすれば…
32. 行が増えた！！！
33. やってみよう 動く・呼べる・[渡せる]・返ってくる ↑
34. やること ▌Slackの投稿内容をスプレッドシートに渡す Google Spread Sheet Google Apps Script パラメータ ありで実行 データ登録 出典：https://slack.com/
35. doPost関数でパラメータを受け取る function doPost(req) { // TokenCheck if (req.parameter.token != “Slackのトークン") { return; } var textArray = req.parameter.text.split(":"); // コロンの後ろに文字がある場合のみ実行 if (textArray.length > 1) { myFunction(textArray[1]); } }
36. myFunction関数で引数を受け取る function myFunction(text) { var sheet = SpreadsheetApp.openById(‘スプレッドシートID'); var lastRow = sheet.getLastRow(); sheet.getRange('A' + String(lastRow + 1)).setValue(text); }
37. はまりポイント！！！ 一度ウェブアプリケーションとして公開してから 修正を加えた場合、 プロジェクトバージョンを上げないと反映されない。
38. うまくいけばgas:より後ろの文字がスプレッドシートに入る
39. やってみよう 動く・呼べる・渡せる・[返ってくる] ↑
40. やること ▌スプレッドシートに登録されたらSlackで通知を受ける Google Spread Sheet Google Apps Script パラメータ ありで実行 投稿する データ登録 出典：https://slack.com/
41. SlackでIncoming WebHooksをインストール
42. Incoming WebHooksの設定を保存 チャンネル選択 URLをコピーしてGASの方へ移動
43. SlackへPOSTする関数を作る function postSlack(text) { var url = “SlackのIncomingWebHooksのURL"; var payload = { "text" : text }; var options = { "method" : "POST", "payload" : JSON.stringify(payload) }; UrlFetchApp.fetch(url, options); }
44. doPost関数でpostSlack関数を呼ぶ function doPost(req) { // TokenCheck if (req.parameter.token != “Slackのトークン") { return; } var textArray = req.parameter.text.split(":"); // コロンの後ろに文字がある場合のみ実行 if (textArray.length > 1) { myFunction(textArray[1]); postSlack(textArray[1]); } }
45. GASのプロジェクトバージョンを上げて保存したら試す
46. やまびこキタ――(ﾟ∀ﾟ)――!!
47. おわりに
48. おわりに ▌今回はGASを叩く・GASから叩くの両方やった ▌GASお手軽！便利！(伝わった？) ▌組み合わせる楽しさ ▌本当はAmazonDashButton→GASをやりたかった
49. 参考情報 ▌Google Apps Script  https://developers.google.com/apps-script/ ▌Slack API  https://api.slack.com/ ▌今回作ったコード  https://github.com/szkayeah/Bot/blob/master/hel loGasBot/helloGasBot.gs
50. ありがとうございました！