スプレットシートの更新をworkplaceFeedに通知する

タイトル通り、通知BOTを作る手順をメモします。
WorkPlaceはまだまだ流行っていないので、資料が少ないですね！

チャットに通知するBOTも作りたかったのですが、権限がなく、権限のある方に頼むこともできなかったので、諦めましたｗ
ので、ここではフィード投稿までをゴールとさせていただきます。


# 作成手順
今回は「TODOリストに✓が付いたらWorkplaceに通知する」ものを作ってみましょう。

## 1. スプレッドシートを作成します
新しいスプレッドシートを作成から`TODO`を選びましょう
<img width="382" alt="スクリーンショット 2019-06-17 11.00.37.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/3503227c-508b-00c3-7d6b-4a71648a05ca.png">

適当にタスクを追加します
<img width="461" alt="スクリーンショット 2019-06-17 11.04.07.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/3f8abf46-ad37-0e5a-b640-0caf06159e38.png">

## 2. チェックがついたらアクションするコードを作成
メニューバーから`ツール`->`スクリプトエディタ`

```js:constants.js
var CHECK_COLUMN = "1"; // 納品通知カラム数(A)
```

```js:main.js
/**
 * アクティブセルのステータスをチェック
 * トリガー: 編集時
 */
function getState() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet();
  var activeCell = sheet.getActiveCell();
  var rowNum = activeCell.getRow();
  // チェックBOXがアクティブ&&チェック付いてる時、通知する
  if(activeCell.getColumn() == CHECK_COLUMN && activeCell.getValue()) {
    // 同列の値も取得して通知します
    Browser.msgBox('日付: ' + sheet.getRange('B' + rowNum).getValue() + '\nタスク: ' + sheet.getRange('C' + rowNum).getValue());
  }
}
```

チェックが付いたか否かを調べるために、編集時にこのコードを実行させます。(トリガーの設定)
トリガーの設定は、スクリプトエディタ上部の「編集」⇒「現在のプロジェクトのトリガー」から行います。
`トリガーの追加`で、以下のように条件を選びます。
<img width="710" alt="スクリーンショット 2019-06-17 11.20.41.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/a36e8863-c662-a50a-002f-03bf15873d7b.png">
その後`アクセスを許可`までして完了です

チェックを付けたら実行されたらOK
<img width="927" alt="スクリーンショット 2019-06-17 11.36.03.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/0a4447c4-41d8-5c8b-9e07-5e073beb2fc1.png">


## 3. WorkplaceでBOTアプリを作成
※BOTを作るには、そのグループの管理者権限が必要です。
BOTを使うグループのメニューから`Intergrations`を開きます。
`Create Publishing Bot`から作成
<img width="825" alt="スクリーンショット 2019-06-17 11.26.11.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/b8d39e79-5308-e0b4-defa-30de5fec05be.png">
今回はテスト用に作ってみました。
<img width="394" alt="スクリーンショット 2019-06-17 11.26.57.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/73c8d736-b578-ccc4-455d-f7e8efe8cdec.png">
`Create New Access Token`からトークンを取得・メモします。

## 4. BOT通知する
スプレッドシートにもどって、先程メモしたトークンをコードに書きましょう。

```js:constants.js
// workplace
var FACEBOOK_API_URI = 'https://graph.facebook.com/v3.0';
var WORKPLACE_ACCESS_TOKEN = 'DQVxxxxxxx';
```
mainも編集します。

```js:main.js
/**
 * アクティブセルのステータスをチェック
 * トリガー: 編集時
 */
function getState() {
  var sheet = SpreadsheetApp.getActiveSpreadsheet();
  var activeCell = sheet.getActiveCell();
  var rowNum = activeCell.getRow();
  // チェックBOXがアクティブ&&チェック付いてる時、通知する
  if(activeCell.getColumn() == CHECK_COLUMN && activeCell.getValue()) {
    // 同列の値も取得して通知します
    postWorkPlaceFeed('日付: ' + sheet.getRange('B' + rowNum).getValue() + '\nタスク: ' + sheet.getRange('C' + rowNum).getValue());
  }
}

/**
 * Workplaceに投稿する
 */
function postWorkPlaceFeed(text) {
  UrlFetchApp.fetch(FACEBOOK_API_URI + '/group/feed?&access_token=' + WORKPLACE_ACCESS_TOKEN, {
    method : 'POST',
    contentType : 'application/json',
    payload : JSON.stringify({
      message: '# タスクが完了しましたBOT\n' + text, // 投稿内容です
      formatting : 'MARKDOWN' // MarkDown使いたい場合はここにいれましょう
    })
  });
}
```

公開前に、認証を許可しなくてはなりません。
スクリプトエディタ上部の「編集」⇒「現在のプロジェクトのトリガー」からスクリプトを実行します。
<img width="414" alt="スクリーンショット 2019-06-17 11.38.34.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/981e3255-0ea0-d238-ca0a-7b5eede6cca5.png"><img width="436" alt="スクリーンショット 2019-06-17 11.38.42.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/6fb21d97-d318-ccdb-1118-679ae99ca9be.png">

認証したらチェックBOXにチェックを付けてみましょう。
Workplaceに投稿されたら成功です！
<img width="505" alt="スクリーンショット 2019-06-17 11.41.23.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/80770/4065fc13-1d2f-3624-e941-459735c98919.png">

# おわり
とても簡単だったと思います。
Workplaceは資料が少なかったので、メモをかねてまとめてみました。
チャットとFeedは、またBOTの役割が変わると思います。どう使っていくか運用次第ですね
お役に立てたら光栄です。
間違いなどありましたらご指摘お願いします！

# 参考サイト
今回の記事には関係のないのも混じっていますが、botを作ってくうちに参考になったものをまとめておきます。
- [Googleスプレッドシートだけで作るFB messenger bot](https://qiita.com/KeitaMoromizato/items/79c030f6c1bf2f270354)
- [Facebook Messenger Botの作り方　〜AWS Lambda(Serverless)での構築〜](https://qiita.com/KeitaMoromizato/items/98cae74d8c02d289c22e)
- [Bots for Workplace](https://developers.facebook.com/docs/workplace/integrations/custom-integrations/bots)
- [Facebook にボットを接続する](https://docs.microsoft.com/ja-jp/azure/bot-service/bot-service-channel-connect-facebook?view=azure-bot-service-4.0)
- [初めてのサーバーレスアプリケーション開発 ～Serverless Framework を使ってAWSリソースをデプロイする～](https://dev.classmethod.jp/cloud/aws/serverless-first-serverlessframework/)
- [(公式)POST](https://developers.facebook.com/docs/workplace/reference/graph-api/post/)
- [WorkplaceのAPIでPOSTする時にメンバーにメンションしたい](http://www.pre-practice.net/2018/12/workplaceapipost.html)