chatwork で自分への TO を探せるようにする

chatwork で起こりがちな自分に送られてきた `TO` を探し出せなくなる問題を GAS をつかったハックでどうにかしてみましょう。

## chatwork では自分への `TO` が探せない？

Slack なら沢山のチャンネルにはいっていても、自分へのメンションを検索することができます。
chatwork では同等の検索機能がないのです。なので、見失ってしまった `TO` メッセージを探すには、投稿されたメッセージを思い出してヒットしそうなキーワードで検索するか、チャットルームの過去メッセージを目力でクロールして探し出す必要があります。

## 温かみのある解決方法

- `TO` に対して回答を保留したものは横着せずにタスク化する
- `TO` に対して回答を保留したものは横着せずに未読にもどす

なかなか良さそうですね。
でも一言だけ言わせてください。
クソ面倒です。

## 自分への `TO` メッセージを引用して専用のチャットにまとめる

専用チャットに自分への `TO` メッセージを引用しておけば、あとから探すのはカンタンですね。
これを GAS で自動化してみようと思います。
まずは温かみのある手作業でプロセスを確認しておきましょう。

1. 専用のチャットルームを作成しておく
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/b3b75a36-9c0d-8608-fd7a-28d13e71ddd3.png)
1. 自分宛のメッセージがきたら「引用」と「リンク」メッセージを作成
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/92ba5140-7bcc-2b87-98c5-cfcb80b44356.png)
1. 作成したメッセージを専用のチャットルームに投稿する
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/3da04e00-3d7c-49d2-eb2d-e65645ac8137.png)

## chatwork Webhook × Google Apps Script で自動化する

### chatwork Webhook ってなんだろう？

Webhook ってなんだっていう方は [公式サイトの説明](http://developer.chatwork.com/ja/webhook.html) をご一読ください。

`TO`, `TOALL`, `返信` が来たら、設定してある URL に送られたメッセージの情報を含めて送り付けるよ！
送り付けた先で好きなようにいろいろやっていいぜ！

っていう chatwork サーバー側の優しい仕組みです。

### Webhook を含めたデータの流れを理解する

[![alt](http://www.plantuml.com/plantuml/png/SoWkIImgAStDuIe0qfabcVbv2ah96OabvVb5sO-RbprktlEuQHkGT5HIgEPIKD3GqbJGrRLJK4AMSthSk2F4_t7pmiVDpO-RTeF5TxniQ7ooVw4ILoqsanKUDsq5AMkU02J19XDl8iX-e78qoMTTKv-lsA-amAM0rNthmbEJFFBpirzitVwqUogQgzmTWpNSy_FJSr8Ld7FoIrCK0d8IIzBoYt8rmKuZP1YcXOwF6tk0hdtSkFXnutmCVpnhRdswOEFJ_kdWy560EXXDqTEk1K-tBts_f__Pr2rFzow2gqC4eME0fyBZnkLFDpGzdxBYSNFZu-R580EQEnuthmQ7xOB7ZQknXXB8-q2pG979vP2QbmACVW00)](http://www.plantuml.com/plantuml/png/SoWkIImgAStDuIe0qfabcVbv2ah96OabvVb5sO-RbprktlEuQHkGT5HIgEPIKD3GqbJGrRLJK4AMSthSk2F4_t7pmiVDpO-RTeF5TxniQ7ooVw4ILoqsanKUDsq5AMkU02J19XDl8iX-e78qoMTTKv-lsA-amAM0rNthmbEJFFBpirzitVwqUogQgzmTWpNSy_FJSr8Ld7FoIrCK0d8IIzBoYt8rmKuZP1YcXOwF6tk0hdtSkFXnutmCVpnhRdswOEFJ_kdWy560EXXDqTEk1K-tBts_f__Pr2rFzow2gqC4eME0fyBZnkLFDpGzdxBYSNFZu-R580EQEnuthmQ7xOB7ZQknXXB8-q2pG979vP2QbmACVW00)

### 実際に自動化してみよう

コードなんて実際に書いて、動かしてなんぼ。
実際にやってみましょう。
`TO` をあつめるチャットルームは事前に作っておいてください。

なんも準備できてないし、わからんって場合は先に
 [こちらの記事](https://qiita.com/yamatomo73/items/9168ac844df93da5afa7#chatwork---google-apps-script-%E3%81%A7-hello-world)
をどうぞ。


1. 新規で google スプレッドシートを作成する
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/13af1801-0c84-4743-6c3b-f3204d850caa.png)
1. 適当に名前を付ける  
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/43e23752-b1a0-2733-3751-f259b716e2ef.png)
2. スクリプトエディタを開く  
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/5897c5e9-210c-9291-6c54-0f2967e3c515.png)
1. ライブラリを追加  
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/471349f7-8809-817d-de4f-e70679e850ba.png)  
3. コピペして `TO` をあつめるチャットルームIDとAPI_TOKENを設定

    ```js
	/**
	* chatwork Webhook から TO メッセージ情報を受け取る
	* @param {Object} e - TO メッセージ情報 see. http://developer.chatwork.com/ja/webhook.html#eventType
	*/
	function doPost(e) {
	  // API_TOKEN を設定する
	  var api_token = 'aaaaaaaaaaaaaaaaa';
	  // TO メッセージを集めるチャットルームIDを設定する
	  var postRoomId = 9999999;

	  var json = JSON.parse(e.postData.contents);
	  var message = json.webhook_event.body;
	  var roomId = json.webhook_event.room_id;
	  var fromAccountId = json.webhook_event.from_account_id;
	  var messageId = json.webhook_event.message_id;
	  var sendTime = json.webhook_event.send_time;

	  if (roomId == postRoomId) {
	    // 投稿専用チャットルームからのイベントは無視する
	    return;
	  }
	  
	  // 情報を整形して投稿する
	  var client = createClient_(api_token);
	  client.sendMessage(
	    {
	      room_id: postRoomId,
	      body: Utilities.formatString("[qt][qtmeta aid=%s time=%s]%s[/qt]\nhttps://www.chatwork.com/#!rid%s-%s", fromAccountId, sendTime, message, roomId, messageId),
	    }
	  );
	}

	function createClient_(api_token)
	{
	  return ChatWorkClient.factory(
	    {
	      'token': api_token,
	    }
	  );
	}
    ``` 
3. ウェブアプリケーションとして導入
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/3d180d78-e4c7-4db6-37b6-8f7b57bdd9e5.png)
4. 「全員（匿名ユーザを含む）」で導入
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/dfef032f-814e-c945-2164-202fc408ea27.png)
5. 表示された URL をコピー
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/982c9f32-1f3b-d276-ee15-1f162638c2e0.png)
1. `TO` を集めたいアカウントに Webhook を設定する
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/49c8bcdc-5823-0a05-0051-36c404eff2a5.png)  
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/44cf0deb-21fa-db66-08f5-7162cd90b574.png)  
Webhook URL には「ウェブアプリケーションとして導入」で最後に表示されたURLをコピペ
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/c3306106-2603-2408-cf7b-81042c8091e5.png)  
1. 準備完了 🙌

### 動作確認

それでは、自分に `TO` がきたときの動作を確認してみましょう。

+ `TO` きた！
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/ce2abf37-dfc5-94d8-3a06-67a91c5dfc8c.png)
+ 専用チャットに自動で投稿されてる！
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/67d6ee12-2eb7-c0cf-1a49-7e4517485a6d.png)

🙌
いろいろいじって、好きなように変えてみましょう。

### 自分宛のメッセージを検索する

この状態で自分宛のメッセージをためていけば、自分宛のメッセージで絞り込んだ検索もしやすくなります。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/8445e18e-e182-1d61-399a-7ef0230819b3.png)

`TO` の迷子探しから解放されそうですね。

### ⚠️いろいろやるときの注意⚠️

今回の設定で Webhook で自分に `TO` があったら通知してくれるようにしています。
通知さえるメッセージの本文には、そのまま自分への `TO` が記述されています。
そのメッセージを API 経由でチャットルームに投稿するとどうなるでしょう？
その投稿メッセージにも `TO` が含まれていますから、Webhook が起動します。すると、また通知がとどいて GAS がそのメッセージをまた引用して投稿する...
つまり無限ループって怖くね？
そのためのガード条件が入っています。忘れると無限ループってこわくねってなります。


```js
  if (roomId == postRoomId) {
    // 投稿専用チャットルームからのイベントは無視する
    return;
  }
```

うっかりして、やばい動きになったら、Webhook を無効化しましょう。
だいじょうぶ、だいじょうぶ、Webhook はぜんぜん怖くないから。
![image.png](https://qiita-image-store.s3.amazonaws.com/0/191263/4f83a561-d17a-747e-ce09-424c453ad455.png)


それではみなさんもよき chatwork × GASライフを！