API GatewayとLambdaでSlack翻訳アプリを作成してみました

AWS
Lambda

2019.08.21

この記事を書いたメンバー：

Anna

API GatewayとLambdaでSlack翻訳アプリを作成してみました

AWSを本格的に触り始めて3か月経ったので、試しにSlackアプリを作成してみました。

このアプリについて

1. “Hello”を送信する
2. [Translate to Japanese]を選択する
3. 翻訳された結果が返る

技術的要約

◇2と3の間で起きていること
2.1 SlackはエンコードされたURLを送信する
2.2 API gatewayはJSONに変換しLambdaへ送る
2.3 LambdaはデータをParseしAmazon Translateへ送り、SlackにPOSTする

#Parseされたデータ:event['message']['text'] = "hello"
event['callback_id']] = "ja"
event['response_url'] = "https://hooks.slack.com/app/ABCDE/12312341234/"
#Amazon Translateに送られるデータ:
          (     
          Text=hello,
         SourceLanguageCode=auto,
         TargetLanguageCode="ja"
          )
#Slackに送られるデータ:
POST /app/ABCDE/12312341234/
Host: hooks.slack.com
Content-type: application/json
{
    "blocks":[
        {
          "type": "section",
         "text": {
            "type": "mrkdwn",
            "text": "こんにちは"
           }
    }
    ]
}

1.　Lambdaの作成

1. [一から作成]
2. 関数名を入力する
3. ランタイムは、[Python 3.7]を選択する

[関数の作成]をクリックする

コードを編集できるようになるので全て選択し、以下のコードに置き換える

frombotocore.vendored importrequestsimport boto3
import json
def create_slack_payload(text):
    return {
    "blocks": [
        {
            "type": "section",
            "text": {
                "type": "mrkdwn",
                "text": text
            }
        }
    ]
    }
 
def lambda_handler(event, context):
    msg = event['message']['text']
    target_language = event['callback_id']
    response_url = event['response_url']
     
    print("翻訳前：" + msg)
    print("response_url：" + response_url)
    print("callback_id：" + target_language)
    print(json.dumps(create_slack_payload(msg)))
     
    client = boto3.client('translate')
    translate_response = client.translate_text(
    Text=msg,
    SourceLanguageCode='auto',
    TargetLanguageCode=target_language
    )
     
    translated_text = translate_response["TranslatedText"]
     
    print("翻訳後：" + translated_text)
    r = requests.post(response_url, data=json.dumps(create_slack_payload(translated_text)))
    return r.json()

◇テストイベントの設定:
関数をテストするために、テストイベントを設定する

ドロップダウンメニューをクリックし、[テストイベントの設定]を選択する以下のサンプルのJSONでテストイベントを作成する

{    "type": "message_action",
    "token": "ABCDEFGHIJKabcdefghijk",
    "action_ts": "123456789.012345",
    "team": {
        "id": "ABCDE12345",
        "domain": "slack-domain"
    },
    "user": {
        "id": "ZZAABBCC12",
        "name": "username"
    },
    "channel": {
        "id": "ABCDEFG123",
        "name": "directmessage"
    },
    "callback_id": "ja",
    "trigger_id": "123412341234.123412341234.12341234asdf1234asdf",
    "message_ts": "123412341234.0000000",
    "message": {
        "client_msg_id": "a1b2c3-a123-b456-b631-1191f49ab175",
        "type": "message",
        "text": "hello",
        "user": "ZZAABBCC12",
        "ts": "123412341234.0000000",
        "team": "ABCDEFG1234"
    },
    "response_url": "https://hooks.slack.com/app/ABCDE/12312341234/12341234asdfaf"
}

下部の[保存]をクリックして、テストイベントを保存する
右上の[保存]をクリックして、関数も保存する
◇実行ロール:
Lambda関数はAmazon Translateを呼び出すので、IAMロールが必要 Lambda関数のページで、[実行ロール]までスクロールダウンする
“YOUR-ROLE-NAME roleを表示”をクリックすると、IAMコンソール画面が開く

[ポリシーをアタッチします]をクリックする
“translate” と検索し“TranslateReadOnly”ロールを選択する

下部の[ポリシーをアタッチ] をクリックする
Lambda関数に戻り、正しい権限があるかDesignerを確認する

ここで、先ほど作成したLambda関数をテストできる
[テスト] をクリックし以下の画面が表示される

[ログ出力]の下部では以下の画面が表示される

2.　API Gatewayの作成

API Gatewayの画面で、[APIの作成]をクリックする

[アクション] -> [メソッドの作成]をクリックする

“POST”メソッドを作成する
統合タイプで[Lambda関数]を選択する
[保存]をクリックする

“OK” をクリックし、権限を追加する

次にエンコードされたURLデータをJSONに変換するために、マッピングテンプレートを作成する
[統合リクエスト]をクリックする
[マッピングテンプレート]で、テンプレートを新規作成する
[マッピングテンプレートの追加]をクリックする

マッピングテンプレートは以下:
application/x-www-form-urlencoded

#set($test = $input.body.substring(0,8))
#if($test == "payload=")
#set($encodedJSON = $input.body.substring(8))
$util.urlDecode(${encodedJSON})
#end

次に、APIをデプロイする

[アクション]メニューで、 [APIのデプロイ]をクリックする

ステージを指定する

URLをコピーする
これはSlackアプリ作成時に必要

3.　Slackにインストール

https://api.slack.com/apps
[Create an App]をクリックする
アプリ名を入力し、 [Create App]をクリックする
[Interactive Components]で、スイッチをオンにする。
Request URLのために、 API GatewayからURLをペーストする