GASを利用して、Slackで多言語翻訳やってみた

## 概要

Google Apps Script（通称GAS）に最近興味を持ち始めました。
Gmailと組み合わせたり、いろいろと出来るのですが、今回はGoogle Translateを利用して、Slackからの日本語投稿を英語などに翻訳して返すBotを作ります
GASは、JavaScriptの文法で書かれているため、JavaScriptをまだ触ってない方は、一旦JavaScriptの文法を一通りやってみてもいいかもしれませんが、簡単なチュートリアルなら、コード内容からどんなことをやってるかわかるかと思います。


今回の記事は、大きく２つのプロセスとなっています
- GASの作成
- SlackBotの作成
順番に説明していきます

## GASの作成

[ここらへんの記事](https://qiita.com/numanomanu/items/7bb6542961a2c567f05c)を参考にプロジェクトを作っていきます。

プロジェクト作成後、SlackがPOSTリクエストなので、``doPost関数``を使います。
GASの場合、getリクエストとpostリクエストには、それぞれすでに関数が用意されていて、それでリクエスト内容を処理することができます。

```JavaScript
function doPost(e) {
  
}
```
doPostの中身はこのまま空で、次に翻訳テキストを返す関数を作ります。
関数名は何でもいいですが、ここでは``getTranslateText``とします。
引数にはtextとtriggerの２つを設定します。
ここのtextとは、slackで入力したtext内容で、triggerは、slackで設定したときのtriggerとなるキーワードとなります。

```JavaScript
function getTranslateText(text, trigger) {
    var targetText = text.replace(trigger, '');
    return LanguageApp.translate(targetText, "ja", "en");
}
```

ここで何をやっているかというと、ここのAPI名を見てみるとわかるように、``LanguageApp.translate``という形で、翻訳テキストを返却しています。また、入力したtextに、トリガーのキーワードを除外し、それをja->enというように、日本語を英語に翻訳したテキストを返却します。

次に先程のdoPost関数を次のように更新します。

```JavaScript
function doPost(e) {
    var message = getTranslateText(e.parameter.text, e.parameter.trigger_word);
}
```

SlackのPOSTリクエストは次のような形となります

```JavaScript
token=AHznGq65tpUulOR9iZwAoPkJ
team_id=T0001
team_domain=例
channel_id=C2147483705
channel_name=テスト
timestamp=1355517523.000005
user_id=U2147483697
user_name=スティーブ
text=googlebot: 身軽なツバメの対気速度はどのくらい？
trigger_word=googlebot:
```

こうしたパラメータは、e.parameter.hogeという形で取得でき、ここでは、textとtrigger_wordを取得しています。

最後に、Slackにレスポンスする関数を作成します。
urlにはSlackの着信用Botで設定したWeb hook URLをいれてください

```JavaScript
function postSlack(text){
  var url = "https://hooks.slack.com/services/~~~~";
  var options = {
    "method" : "POST",
    "headers": {"Content-type": "application/json"},
    "payload" : '{"text":"' + text + '"}'
  };
  UrlFetchApp.fetch(url, options);
}
```

そして、doPost関数を更新します。

```JavaScript
function doPost(e) {
    var message = getTranslateText(e.parameter.text, e.parameter.trigger_word);
    postSlack(message);
}
```

ここまで終わったら、GASを公開してください
公開->ウェブアプリケーションとして公開->プロジェクトバージョンを新規作成とし、全員に公開をして更新ボタンを押してください。
**なお、コードを変更して、外部に公開する場合は、毎回新規作成とする必要があります。**

公開したら、URLをあとで使うので、どっかにメモってください。


## Slack Botの作成

トークンを作成する方法とかあったりするのですが、一番カンタンな方法でやってみたいと思います。
ここでは、発信用と着信用の２つのBotを作成していきます。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/135757/26129b65-9ba4-3438-92f3-936cdc827349.png)

![image.png](https://qiita-image-store.s3.amazonaws.com/0/135757/aa4225e7-10f8-a0f8-7178-06bcec8a09fc.png)

### 発信用Botの作成

下記画像のように、設定したいSlackのチャンネル開いたところで、Appの管理画面をブラウザで開いてください。


検索窓に「outgoing」と打ってみてください。
最近Slackが日本語対応したため、「発信Webフック」というアプリが出てくると思うので、それを選択してください。


次に設定を追加ボタンを押して、設定画面に移動します。

ここでは、導入したいチャンネルの設定、トリガーとなる言葉、POSTするURLを入力します。
URLには、先程公開したGASのURLを入力します。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/135757/fbd33fbf-45b4-bc9b-ac33-24d327de937a.png)


これで発信用BotはOKです

### 着信用Botの作成
発信用Botと同じように、検索窓に「incoming」と打ってみてください。着信Webフックが出てくるので、これでアプリを設定しましょう。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/135757/7ffcb1fd-bddd-b3b3-3053-e3e4c93c0152.png)

ここで、Web hook URLが出てくるので、GASのところで作成したpostSlack関数の中身に、これを設定します。

着信用Botはこれでオッケーです。

**以上で設定はこれで完了です！それでは実際に試してみましょう！**

私の場合、トリガーをgasとしています。

![image.png](https://qiita-image-store.s3.amazonaws.com/0/135757/3bdce32f-7ef1-98cf-6ae6-cccb7d30ae15.png)

若干変なところがありますがだいたい翻訳できてます！！

## おまけ
一度に複数言語にも翻訳できるので、次のような多言語翻訳も５秒位で返ってきます。


![image.png](https://qiita-image-store.s3.amazonaws.com/0/135757/71497bf2-473c-d6e6-994c-91530d588874.png)


GAS面白い！！