slack appを作ってみる
inomotoslack app全然知らないのでちょっと触ってみる。どういう種類があってどういうリソースを要求するのかなど。
オレオレsandbox workspaceはあるのでそこに適当に作って遊ぶ。
inomoto適当にslack appとググると
が出てくる。
右上に Create New App とあるので押すと、なにやらFrom scratchかFrom an app manifestが選べる。
後者はBETAアイコンがついているのでスルー。
From scratchで進み、App Nameとworkspaceを選んでCreate App
inomoto出来上がったappの詳細画面には add features, install your app, manage distribution のconfigure的なセクションとApp Credentialsのセクション、その他セクションがある。
featuresにはincoming webhooksやinteractive components, slash commandsなどがある。
それぞれ進むと有効化フラグがあるが、有効化すると内容に応じたオプションが出る。
interactive components, slash commands, event subscriptionsでは各種callをslackから受け取るためのURLを指定するようになる。
なんらか処理の実体があるWeb APIを作り、ここに指定する流れなのだろう。
botsはそれとは雰囲気が違い、先に権限スコープのついたtokenを作っておく案内が出ている。
また、appへのDMを開いたときのタブを制御する画面もある。
inomotoてか、めちゃ今更ながら、appのページのグロナビにTutorialsがある。ちょっと触ってみよう。
inomotoPublish interactive notifications から。
下の方に手順っぽいのがあるが、Create a pre-configured appがあるのでやってみる。
inomotopre-configuredなappを作ると、いくつか機能が有効化された状態のappが出来上がる。
先の例の場合、interactive componentsとbotsが有効化され、permissionsが適当に設定されている。
で、言われるがままinstall your appする。
と、slackのworkspaceにappが生える。
inomotostep1を開くとBoltのGetting Startedのリンクがある。
開くとjsとpythonとjavaのSDKの紹介がある。
slackは基本的にweb apiなのでHTTPが喋れればアプリは作れるはずだが、説明によるとこのboltは認証や各種機能にいい感じにアクセスするwrapper的なフレームワークらしい。
jsで進めてみようと思うが、先にざっとコードを見る。
アプリケーション本体のコードとcode to run appがあり、後者を見るにサーバプロセスが起動するよう。
何が動くのかはともかく、ひとまず環境構築か。
inomotoソースコードブロックの下に Getting Started with Bolt for Javascriptというリンクがある。App自体の作成のセクションもあるが、そこは済んでいるのですっ飛ばしてSetting up your Bolt appまでいく。
なにやらGlitchというweb開発環境を使うテンプレがあるもよう。なんか面白そうなので使ってみる。
Remix the app templateというボタンを押すと何やら起動する。
...これ登録といらんのか。
inomoto出来上がったらREADMEが見えているが、slack側のgetting startedの続きを見つつ.envを埋める。
slack appの詳細画面を見ながら適当にコピーしてくる。
getting startedに沿ってアプリケーションコードを書くともともとのルートから逸れてしまうので、ここでは起動確認くらいをしておく。
エディタの右上あたりにShareがあるので押すと、Project linksとして Live siteのURLが出てくる。
appプロセスを起動しているだけでエントリポイントなどは何も無いが、ひとまずcurlを投げつける。
curl -v https://some-project-name.glitch.me
htmlな感じの404が返ってくる。あとヘッダを見ると x-powered-by: Express とあるので、まぁ多分このjsのアプリケーションが動いてるんやろ多分。というところでざっと動作確認としておく。
inomotobotのチュートリアルまで戻り、次へ進む。
step2はslack apiにおけるmessagingのフォーマットの話が書いてある。ここにあるプレビュー機能は面白いが、一旦スルー。
で、step3に進むが...
コードサンプルの Show code to initialize app が開かない。前提が無いと進めないのだけど...
というわけでこのチュートリアルは捨てる。幸いglitchの方にサンプルはあるし、キーワードからググりながらなんかできるでしょ。
inomotoglitchに作られたサンプルをなんか動かしてみる。
examplesにあるコードはエントリポイントまでちゃんと書いてあるので、まるっとコピーしてapp.jsに貼れば動く。
app.jsを更新すると自動保存＆自動再起動がかかるようだ。
actions.jsの方にはslack commandとinteractive componentがある。
早速slack commandの方を設定してみる。
inomotoslack appの詳細画面に戻り、slash commandを有効化し、新規コマンド作成に進む。
glitch側で動かしているサンプルコードを見ると helloworld というコマンドが有効化されているように見える。
というわけでCommandに /helloworldを、 Request URLに https://some-project-name.glitch.me/slack/helloworld を入れ、その他は適当に入れる。
Saveすると、permissionの変更によるapp再インストール要求があるので従っておく。
inomotoえー。
inomotoどうもRequest URLに入れるのは https://xxx/slack/events で固定らしい（少なくともboltでは？）。
設定するとなんかでた。
inomotointeractive componentsも有効にし、こちらも同様に /slack/events をURLとして入れておくと、先程の /hello world slash commandの返答にくっついているボタンが動くようになる。
ここでコードをざっくり見ると、slash commandのメッセージブロックにaccessoryにボタンがあり、そこにaction_idとして button_abc が指定されている。で、button_abcがactionとして登録されているのでそれが発火する。
inomoto流れでglitch上で動くboltのアプリケーションになったので詳細がかなり隠されているが、雰囲気的には
- （slash commandやactionのようなslack->appのものは）appをweb serverとして立てておき、slackがリクエストを投げる
- slack側でappのガワを作っておき、token類をappに読ませる
- boltでアプリケーションを書いておくと、レスポンスを含めなんらかいい感じにやってくれる
という感じか。
なお今回試していないが、slack appにはSocket Modeというのがあるようで、publicなhttp portを晒せない場合でもweb socket経由でイベントを受け取ることもできるらしい。
また、今回のやり方だとサーバプロセスを立てっぱなしにする必要があるが、AWS lambdaみたいな感じでやる方法を確認したい。
inomotoAWS Lambdaの方法はドキュメントがある。
boltのappにはreceiverというのを指定でき、ここにあれこれしてlambdaのイベントをいい感じに取得できるようにしているっぽい。
要はappとのmessagingが抽象化されており、そこにserveless framework & expressのものを差し込んでいるようだ。
そのためだけにserverless framework管理化に置くのはなぁという気がするが、要は通信レイヤを差し替えればいいだけなので、他にももっとシンプルな実装は落ちているであろう。
inomotoと思ったら @vendia/serverless-express はserverless framework関係ないっぽいな？依存もゼロなのでスッキリ使えそう。
...実装もまぁ色々やってそうな割にはコンパクトな印象。
inomotoとりあえずlambdaを試すのは下記参考にそのまま突っ込めばとりあえず動く。
一旦動かすのであればserverless frameworkに乗っかると色々と楽。