Help us understand the problem. What is going on with this article?

Amazon API GatewayとAWS LambdaでつくるインタラクティブなSlackAppその2(Interactive Components)

昨日はコマンドを作成し、レスポンスによってボタンを表示しましたが、
今回の記事ではSlackAppにおける機能としてInteractive Componentsを利用しています。

また、この記事では以下の要素を利用して、SlackAppを構築するための基本的な部分を実装していますが、
個々の要素の具体的な利用方法や言語の実装についてはあまり触れません。

  • Amazon API Gateway
  • AWS Lambda (Golang)
  • CloudFormation (AWS SAM)

TL;DR

昨日の続き
ボットが送信したボタンのクリックに対して対応した内容にメッセージを書き換える仕組み

以下の動作を参考にしてください。
command.gif

前提条件

昨日の記事を読んでいる事

Interactive Componentsの有効化

有効化しないで実行するとこのような状態になります
failed.gif

アプリの設定の左メニューから「Interactive Components」を選択し、OFFになっているのをONに変更します。
変更すると以下のような画面になるので、「Request URL」に昨日利用したAPIのURLとその後ろにinteractiveと入力して保存してください。

スクリーンショット 2019-12-08 21.49.47.png

動作確認

エラーになっているところをもう一度クリックすることで設定のURLにリクエストが飛んでメッセージの書き換えの処理が走りました。
success.gif

アプリケーション全体の流れ

思ったより内容薄すぎるので、前回のものと合わせアプリケーションの全体の流れを整理しました。

slackappdiagram.png

  1. SlackのUIからコマンド/chatops channel list送信
  2. APIGateway(slash command用)が受けてLambdaに転送
  3. LambdaはSlackAPIをコールしてチャネルのリストを取得しインタラクティブ用ボタンのメッセージを作成して返却
  4. APIGatewayはその内容をそのまま返却
  5. SlackのUI側で返却値を元にメッセージを表示(※成功時は全員に表示するが、エラー時は送信者のみになるよう制御している)
  6. ユーザーがUI上に表示されたボタンをクリック
  7. APIGateway(interactive components用)が受けてLambdaに転送(送信者やレスポンス送信用のURLなどが渡されている)
  8. Lambdaはレスポンス送信用URLに書き換え用メッセージを送信(非同期で30分以内に5回まで送信可能)し、200 OKと空レスポンスを返却
  9. APIGatewayはその内容をそのまま返却(リクエストから3秒以内に返さないとエラーになる)

なお、リクエストをうける側としてSlackからのリクエストが正しいものかどうかを検証する処理が必要です。
詳しくは公式の説明を確認してください

あとがき

サンプル実装においてslash commandはサブコマンド毎に分岐できるようにアプリケーションを作ってますが、interactive componentsはアクション毎の分岐をするように作っていません。
本来はアクション毎の分岐を実装しないといけないのでもし実装を参考にされる場合にはその点をご注意ください。
なお、コマンドとインタラクションの両方ともがアプリケーション内の分岐をしっかり制御しないとif文だらけの実装になりますので、注意してください。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away