Downloaded 13 times
![10
COPYRIGHT(C) TECHNOMOBILE ALL RIGHTS RESERVED.
講師
Gashfara,Inc.代表
デジタルハリウッド大学院客員講師
茂木健一
mogi@gashfara.com
kenichi.mogi@tcmobile.jp
http://facebook.com/mogiken
http://www.slideshare.net/mogiken1
自己紹介
[プロフィール/実績]
もぎ・けんいち●青山学院大学大学院卒。Gashfara,Inc.代表。本社はハワイですが出社したことなし。
ホノルルマラソンには参加ｗ
青山学院大学大学院卒：エニックスでオリジナルゲーム制作(Z80アセンブラ CP/M)、SmallTalkで
人工知能開発（企業買収）。
（株）東洋情報システム退社後、（株）エイチアイ、グランスフィア（株）、（株）ファッション
ウォーカー（えびもえのEC）など数社のベンチャー企業の立ち上げ・創業期に参画し、ガシュファ
ラ・インクをUSで起業。システム開発ではゲーム、TOL（ツタヤオンライン）の立ち上げ。動画配
信システム(USENのGate01：Gyaoの前進)、電子マネーシステム（Bitcash）、ECフルフィルメント
システムなど、多彩な分野を経験。IT関連教育では1998年ころからデジハリの２．５階に間借りしな
がら教育コンテンツ作成（JIB社）。Brew、Java、セキュリティーなどの講師として活躍。現在、
（株）HUGGを設立し、スマホのカップル向けSNSサービス[HUGG]をグローバルに展開。㈱テクノ
モバイルにて技術顧問。㈱SGPにてドローンのソフトウェア開発もしています。
【著書】
BREWプログラミング実践バイブル [共著] （インプレス）、PHP逆引き大全 516の極意[共著]（秀和
システム）](https://image.slidesharecdn.com/slackgoogleappsscriptjs-160504063005/85/Slack-google-appsscript-js-10-320.jpg)
![24
COPYRIGHT(C) TECHNOMOBILE ALL RIGHTS RESERVED.
６
//Slackのトークンを設定。ひとそれぞれ違う。
var token ="";
//投稿テスト
function postMessage() {
//slackApp インスタンスの取得.このライブラリーを使っている。
https://github.com/soundTricker/SlackApp
var slackApp = SlackApp.create(token);
//最初のchannel idを取得.普通は#general
var channelId = slackApp.channelsList().channels[0].id;
//投稿
slackApp.postMessage(channelId, "ハローワールド", {
username : "最初のボット"
});
}
プログラムはここからダウンロード https://goo.gl/ufTMbL](https://image.slidesharecdn.com/slackgoogleappsscriptjs-160504063005/85/Slack-google-appsscript-js-24-320.jpg)
![31
COPYRIGHT(C) TECHNOMOBILE ALL RIGHTS RESERVED.
６
//SlackからのPostで動く処理。Webに公開しているとこれが動く。
function doPost(e) {
var mes = "お疲れ様です。";//秘書のメッセージ
var type = "";//出社、退社の区別
//eにpostデータが入ってる。
//出社をチェック
if (e.parameter.text.match(/おはよう/)) {
type = "出社";
mes = "おはようございます。きょうもお仕事頑張りましょう！";
}
//退社をチェック
if (e.parameter.text.match(/さようなら/)) {
type = "退社";
mes = "今日もお仕事お疲れ様でした。";
}
//slackApp インスタンスの取得
var slackApp = SlackApp.create(token);
//勤怠をシートに記録
//勤怠を設定している時だけ
if(type != ""){
//idからシートをセット。シートのURLの/d/****/部分。idじゃないとdoPostからはアクセス出来ない。自分のidに変更
var sheet = SpreadsheetApp.openById("").getSheetByName("シート1");
//名前,勤怠、日時を最終行にセット
sheet.appendRow([e.parameter.user_name,type,new Date()]);
}
//メッセージを返す
slackApp.chatPostMessage(e.parameter.channel_id,e.parameter.user_name+"さん。"+mes, {
username : "あなたの秘書"
});
return null;
}](https://image.slidesharecdn.com/slackgoogleappsscriptjs-160504063005/85/Slack-google-appsscript-js-31-320.jpg)
Uploaded by健一 茂木
Slackとgoogle appsscript(js)で作る俺の秘書ハンズオン
JavaScriptでSlackボットを作って、あいさつしたら勤怠表に記録してくれる秘書をつくろう！
![[TL08] 50 分で Bot 開発者になれる！～実践的ノウハウと、 Azure や Office 365 を組み合わせたアーキテクチャの伝授～](https://cdn.slidesharecdn.com/ss_thumbnails/tl08-170614050647-thumbnail.jpg?width=640&height=640&fit=bounds)
![【JAWS-UG Shimane vol.5 】[ハンズオン]サーバーレスで作るチャットBot](https://cdn.slidesharecdn.com/ss_thumbnails/20160604awshandson-160607034637-thumbnail.jpg?width=640&height=640&fit=bounds)
![[Ps11]ネットワーク第4回](https://cdn.slidesharecdn.com/ss_thumbnails/ps114-131029104737-phpapp02-thumbnail.jpg?width=640&height=640&fit=bounds)
Slackとgoogle appsscript(js)で作る俺の秘書ハンズオン
- 1. TECHNOMOBILE GROUP HEAD OFFICE TOKUSHIMA developmentsection | 5floor Column Minamiaoyama,7-1-5,Minamiaoyama,Minato-ku,Tokyo 107-0062,Japan | 3floor Tokushimakenkohkagaku-center,Hiraishisumiyoshi,Kawauchi-cho,Tokushima-shi Tokushima 771-0134,Japan SlackとGoogleAppsScript(JS)で作る俺の秘書ハンズオン
- 2.
- 3.
- 4.
- 5.
- 6.
- 7. 7 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ 下記のように「@俺の秘書 おはよう」「@俺の秘書 おやすみ」をメッセージす るとシートに勤怠が記録され返事が届きます。 ※簡単にプログラム説明します。 何を作るの？
- 8.
- 9. 9 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ この学びの対象者は？ →JavaScript初心者。ブラウザがあれば実 行できます。 教えないことは？ →SlackAPIの細かい仕様
- 10. 10 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. 講師 Gashfara,Inc.代表 デジタルハリウッド大学院客員講師 茂木健一 mogi@gashfara.com kenichi.mogi@tcmobile.jp http://facebook.com/mogiken http://www.slideshare.net/mogiken1 自己紹介 [プロフィール/実績] もぎ・けんいち●青山学院大学大学院卒。Gashfara,Inc.代表。本社はハワイですが出社したことなし。 ホノルルマラソンには参加ｗ 青山学院大学大学院卒：エニックスでオリジナルゲーム制作(Z80アセンブラ CP/M)、SmallTalkで 人工知能開発（企業買収）。 （株）東洋情報システム退社後、（株）エイチアイ、グランスフィア（株）、（株）ファッション ウォーカー（えびもえのEC）など数社のベンチャー企業の立ち上げ・創業期に参画し、ガシュファ ラ・インクをUSで起業。システム開発ではゲーム、TOL（ツタヤオンライン）の立ち上げ。動画配 信システム(USENのGate01：Gyaoの前進)、電子マネーシステム（Bitcash）、ECフルフィルメント システムなど、多彩な分野を経験。IT関連教育では1998年ころからデジハリの２．５階に間借りしな がら教育コンテンツ作成（JIB社）。Brew、Java、セキュリティーなどの講師として活躍。現在、 （株）HUGGを設立し、スマホのカップル向けSNSサービス[HUGG]をグローバルに展開。㈱テクノ モバイルにて技術顧問。㈱SGPにてドローンのソフトウェア開発もしています。 【著書】 BREWプログラミング実践バイブル [共著] （インプレス）、PHP逆引き大全 516の極意[共著]（秀和 システム）
- 11. 11 成長を実現させるシステム”モバイルトータルソリュー ション” Web システム １ スマホ アプリ 2 ゲーム アプリ 3 モバイルトータルソリューション B2B2C • コンシューマ向けの大規模Webシステムの開発からアプリ・ゲーム開発までをマルチデバイスで対応 高い技術力市場ニーズとマッチ 大規模 Webシステム に強い Java,PHP Strong1 最先端技術・独自 フレームワークで 効率的な 開発 Strong2 高トラフィック、 インフラ ネットワーク に強い Strong3 プライマリー ベンダー、 ヒアリング・ 要件定義 に強い StrongⅠ 情報資産の活用 最先端と 知見に強い StrongⅡ 最先端のマルチ デバイス ウェアラブルに 強い StrongⅢ Mashup Awards 5年連続 受賞 会社名 株式会社テクノモバイル 設 立 2008年 資本金 2,500万円 代 表 播田 誠 従業員数 100名（グループ合計） 本社所在地 〒 107-0062 東京都港区南青山7-1-5 コラム南青山 5F 開発室 〒771-0134 徳島県徳島市川内町平石住吉209-5 徳島健康科学総合センター 3F
- 12. 12 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ Slackとは ・2014年に正式に公開 ・社内などでコミュニケーションを行うツー ルです。 ・Slackはチャットが中心のサービスです。 ・他サービスの連携が豊富。これが急速に普 及した理由です。 例） GitHubでpullリクエストを受けたったらSlackに通知 Nagiosが本番サーバの異常を検知したらSlackに通知 IFTTTのレシピで、スマホが社内のWiFiに接続したらSlackに 通知
- 13. 13 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ GoogleAppsScriptとは ・Googleスプレッドシートなどを操作するた めのスクリプトです。 ・MSのExcelのVBAのような位置づけです。 ・JavaScript互換 ・プログラムを外部公開できます。 ・クーロンのように定期実行可能です。 ・ブラウザで共有できるのでOSを問わずExcel よりも便利です。
- 14. 14 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ 全体のシステム構成 Slackユーザ GoogleAppsScript Googleスプレッドシート 公 開 勤怠記録 公開URLを実行チャット 特別なサーバーを用意する必要がありません。
- 15. 15 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ Bot用のSlackチーム登録 https://slack.com/ にアクセスしてボット用のチームを作りましょう。 ① ②チーム名 ③
- 16. 16 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ④アカウント登録 ⑤チームの作成確認
- 17. 17 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ⑥メールにパスワード設定が届く ⑦パスワード設定
- 18. 18 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ スプレッドシートの作成 https://drive.google.com/drive/my-drive にアクセスしスプレッドシートを作成 します。Googleアカウントが必要です（事前準備）。 ① ②適当に名前をつけて保存
- 19. 19 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ Slackライブラリの導入 スプレッドシートにSlack連携のライブラリ−を設定します。 参考：http://qiita.com/soundTricker/items/7bbd86425ae8d0641d50 APIの説明は https://script.google.com/macros/library/versions/d/M3W5Ut3Q39AaIwLquryEPMwV62A3znfOO ① ②スクリプトのファイル名を入力して保存 ※ここにプログラムを作成します。
- 20. 20 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ③
- 21. 21 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ④使用するライブラリの識別子「M3W5Ut3Q39AaIwLquryEPMwV62A3znfOO」 を入力して「選択」します ⑤見つかると一覧に表示されるので最新バー ジョンを指定して保存
- 22. 22 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ SlackAPIのトークンを作成 https://api.slack.com/web にアクセスしAPIにアクセスするためのトークンを 作成。OAuthが正式な認証APIですが難しいので省略。 ①ここから作成 ② ③パスワード入力 ④トークンが作成されます
- 23. 23 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ 投稿の実行 次頁のプログラムをスクリプトエディタに貼り付け、トークン部分を自分の値に 変更し、保存してから実行します。実行する時はプルダウンからpostMessageを 選択し再生ボタンを押してください。認証ダイアログが表示される時は認証して ください。
- 24. 24 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ //Slackのトークンを設定。ひとそれぞれ違う。 var token =""; //投稿テスト function postMessage() { //slackApp インスタンスの取得.このライブラリーを使っている。 https://github.com/soundTricker/SlackApp var slackApp = SlackApp.create(token); //最初のchannel idを取得.普通は#general var channelId = slackApp.channelsList().channels[0].id; //投稿 slackApp.postMessage(channelId, "ハローワールド", { username : "最初のボット" }); } プログラムはここからダウンロード https://goo.gl/ufTMbL
- 25. 25 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ Slackのチームを開いて下記のように投稿されていればAPI連携はOKです。 ※簡単にプログラムの解説をします。
- 26. 26 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ GoogleAppsScriptを公開する Slackボットにメッセージが届いた時にGoogleAppsScript(GAS)を実行するため GASを公開します。 スクリプトエディタで設定します。
- 27. 27 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ 必ず「匿名ユーザーを含む」 URLが表示されるのでメモ このURLをSlackから実行します。
- 28. 28 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ SlackからGASの公開URLを実行するよ うに設定 https://my.slack.com/services/new/outgoing-webhook にアクセスして設定。
- 29. 29 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ボットの設定 反応するチャンネル 反応するキーワード GASの公開URL
- 30. 30 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ボットの処理プログラムを作成 次頁のプログラムをスクリプトエディタに貼り付け、.openById("xx")部分を自分 のシートidを登録し、保存してから、再度バージョンを上げて公開してください。バージョ ンを上げないと古いプログラムが動きます。認証ダイアログが表示される時は認証 してください。 新規作成で公開するとバージョンが上がる ここがシートのID
- 31. 31 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ //SlackからのPostで動く処理。Webに公開しているとこれが動く。 function doPost(e) { var mes = "お疲れ様です。";//秘書のメッセージ var type = "";//出社、退社の区別 //eにpostデータが入ってる。 //出社をチェック if (e.parameter.text.match(/おはよう/)) { type = "出社"; mes = "おはようございます。きょうもお仕事頑張りましょう！"; } //退社をチェック if (e.parameter.text.match(/さようなら/)) { type = "退社"; mes = "今日もお仕事お疲れ様でした。"; } //slackApp インスタンスの取得 var slackApp = SlackApp.create(token); //勤怠をシートに記録 //勤怠を設定している時だけ if(type != ""){ //idからシートをセット。シートのURLの/d/****/部分。idじゃないとdoPostからはアクセス出来ない。自分のidに変更 var sheet = SpreadsheetApp.openById("").getSheetByName("シート1"); //名前,勤怠、日時を最終行にセット sheet.appendRow([e.parameter.user_name,type,new Date()]); } //メッセージを返す slackApp.chatPostMessage(e.parameter.channel_id,e.parameter.user_name+"さん。"+mes, { username : "あなたの秘書" }); return null; }
- 32. 32 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ 下記のように「@俺の秘書 おはよう」「@俺の秘書 おやすみ」をメッセージす るとシートに勤怠が記録され返事が届きます。 ※簡単にプログラム説明します。
- 33. 33 COPYRIGHT(C) TECHNOMOBILE ALLRIGHTS RESERVED. ６ ・社内業務の効率化。勤怠管理。バッチ処理 の完了通知 ・CSの入り口としてのシステム提案 ・人工知能との連携 ・ECでのお勧め商品。キーワード検索では なく。。。音声認識でもなく。。 適用事例（経営者・営業担当の方に）
Editor's Notes
- #12 弊社がご提供しているソリューション内容です。 企画から運営・保守にいたるまでを一気通貫で、 軸となるコンシューマ向けの大規模Webシステムをはじめ、スマホアプリ、ゲーム開発などをご提供しております。 特に大きな実績として、大規模ECシステム、求人検索サイトの開発となっております。 他にも音楽DLサイトや、業務を効率する管理系のシステムの実績も多数あります。 （30秒）