誰でもわかるはず!本気でSlashコマンドの作り方を解説してみた!

プログラミング
この記事は約6分で読めます。
スポンサーリンク

前回に引き続き、今度はSlashコマンドの作り方を解説まとめてみたいと思います

前回(SlackBotの作り方)はこちら↓↓

Slashコマンドとは

Slashコマンドとは SlackAppの機能の1つです。

『 / (スラッシュ)』から始まるコマンドをSlackのメッセージ入力欄に入れて投稿を行うと特定のアクションが出来ます。

↑は簡単な例ですが、

/open [チャンネル名]

というコマンドを使用して特定のチャンネルに移動することが出来ました。

このように普段メッセージを投稿する欄から特別なアクションを行うことをSlashコマンドと言います。

今回作るもの

今回は出勤/退勤コマンド( /kintai [ start / end ])を作ってみたいと思います。

画像を見てもわかりますが、Slashコマンドは「特定の機能の起爆剤になる」ものでSlashコマンド自身では処理は行いません。

今回も前回に引き続き、メインの処理は Integomat を使って進めます。

作成手順

Slashコマンド実行時のリクエスト先を用意する

SlackはリクエストのIPアドレスが固定されているサービスではないので特定のIPアドレスで制限を掛けることは出来ません。

IPアドレスをパブリックに開かれたサーバーを用意する必要があります。

適当にWebhookを用意する

Slashコマンドを設定する

最低限必要なものが揃ったのでSlack上でSlashコマンドを設定していきます。

まずはSlackAppのページに遷移します(SlackAppの作り方が分からない方は前回の記事をどうぞ)

Slack API: Applications | Slack

SlackAppの管理ページから『Slash Commands』から『Create New Command』を選択します。

Create New Commandを選択するとSlashコマンドの設定画面に移ります。

それぞれのパラメータについて解説します。

Command登録するコマンド名
Request URLコマンドが実行されたら送られるリクエスト先
Short DescriptionSlashコマンドの説明
Usage Hint引数のヒント
Escape channels, users, and links sent to your app引数に @[ユーザー名] などの送った際に、ユーザー名のみを送るか、『U12345678』というユニークIDも送るかを選択できる
Preview of Autocomplete Entry実際に使用する際にどう表示されるかの表示例

ほぼそのままの意味なので解説は要らないと思いますが、一点だけ意識してほしい項目があります。

誰かにメッセージを送ったり、特定のアカウントを識別する際『Escape channels, users, and links sent to your app』に必ずチェックを入れてください。

理由は、ユーザー名は本人の設定画面から変更可能だからです。

@suzuki というユーザーが @sato に改名した場合、これまでの suzuki さんと sato さんは紐付けができなくなってしまいます。

チェックを入れると送る内容が少し複雑になってしまいますが、 <U12341234 | suzuki > から <U12341234 | sato > のように絶対に変わらない一意のユニークIDも送ってくれるため関連付けが出来ます。

今回は誰か特定の人を選ぶ形式ではないのでチェックを付けていませんが、誰かを識別したい時は必ずチェックを付けることを覚えておいてください。

必要な欄を入力したらSaveを選択して保存してください。

Scopeが変わった場合、再インストールをする

Slashコマンドを保存すると、以下のようなテロップが出ることがあります。

これは

これまで〇〇という機能しか使わないって言ったのにSlashコマンド使うなんて聞いてないよ!
勝手に変えられるのは困るから、もう一度改めてインストールしてね!

という意味です。

実際、SlackAppに登録されているScopesを確認すると新しくcommandsという権限が増えていることがわかります。

意味さえ理解していれば特に問題がないので、テロップの reinstall your app から再インストールを行いましょう。

動作確認

再インストールが完了すると、先程指定したSlashコマンドを使用することが出来ます。

まだ中身は何も設定していませんが、Slashコマンドを実行すると指定したURLにリクエストが送られます。

サーバー側の処理を作る

先程受け取ったデータを確認すると以下のようなデータが送られてきます。

Slashコマンドを実行すると、 /kintai というコマンド名と start というtext 以外にも、『誰が』『どこで』実行したかも分かります。

これを利用して処理を実装していきます。

ざっくりとこんな感じで作りました。

今回はSlashコマンドの説明のため、細かいパラメータに関しては省略します。

動作確認

サーバーの処理も完成すると以下の動画のように、Slashコマンドが入力されたらスプレッドシートに実行日時が記載されて、メッセージが返ります。

注意事項

セキュリティ面を意識した実装を行ってください!

先程の図でサラリと書きましたが、Slashコマンドを実行するとリクエストにトークンが入った状態でパラメータが送られてきます。

今回作ったものは、Slackから叩けるサーバーなので悪意があれば世界中どこからでも実行出来てしまう処理です。

今回の例であれば、Slashコマンドで送られるパラメータさえ理解していれば、必要なパラメータを含めてそのURLにリクエストを送ることで、毎日出勤時間になったら自動でプログラムを作って簡単に出勤したことにも出来てしまいます。

Slackで以下のようなセキュリティの注意事項が提示されています。

Slack アプリのセキュリティ強化
Learn how to build bot users, send notifications, and interact with workspaces using our APIs.

本来であればリクエスト署名という仕組みを使い、リクエストのヘッダーという場所にあるトークンを使って認証を行います。

今回は非推奨の方法であるパラメータ中のTokenを使って認証していますが、最低限の認証は掛けておくようにしましょう。

まとめ

今回はSlashコマンドについて触れました。

  • Slashコマンドの作成はSlackAppからUI上で簡単に作れる
  • 大変なのはSlashコマンドが実行されたあとの処理
  • セキュリティの確認はしっかりしよう

という点を抑えて貰えればと思います。

ぶっちゃけSlashコマンドはただのインターフェースなので使い方は実装者の工夫次第です。

これまで会社でSlashコマンドを使って色々作ってきましたが、Slashコマンドは定着しない会社だと本当に定着しないです…

作り方は伝えたので後は所属にピッタリな便利Slashコマンドを作ってください!

ここまで読んで頂きありがとうございました!

コメント

タイトルとURLをコピーしました