STREAM DECKとAzure Logic AppsのHTTPトリガーを連携して何かする
はじめに
毎晩「すとぷり」のゲーム実況動画とかを見ているうちに、自分も動画配信欲が上がってきて、とりあえずOBS Studioとか触りだしているタイミングで「STREAM DECK」に目が止まり、どうしても欲しくなったので2021年になった瞬間にポチりました。
ちなみに私はころん君と莉犬君のファンです。
STREAM DECK納品二日目ですが、とりあえず標準機能だけで、特に動画配信とは別の用途でも色々使えそうなので、まずは第一弾ということでAzure Logic Appsと連携してみました。
構成
以前別記事で、LINE Developpersの登録を行っているので、STREAM DECKのボタンが押されたらAzure Logic AppsをHTTPトリガーで呼び出してLINEにメッセージを送る仕組みを作ります。
LINE Developersの準備
以下の記事の再掲ですが、載せておきますね。
【連載記事】Azureを使って一人暮らしの父を見守る(2)Logic AppsとLINE連携偏
LINE Developersのサイトにアクセスして、自身のLINEアカウントでログインをして、開発者登録を行います。
フリープランのままでも、月間1,000通のメッセージ送信が行えるそうなので今回の検証や用途であれば全く問題なさそうです。
プロバイダー登録
サイトにログイン完了後、コンソールのメニューから「プロバイダー」を選択して、新規作成します。
(画面では既にpersonalというプロバイダーが作成済みです)
作成画面で任意の名称を設定して作成します。
チャネル作成
作成したプロバイダーを選択後、チャネル設定画面から「新規チャネル作成」を選択します。
(画面では既にcamera motionというチャネルが作成済みです)
チャネルの種類は「Messaging API」を選択します。
チャネルの設定
作成したチャネルを選択して、「チャネル基本設定」を開きます。
ちょっとうろ覚えなのですが、「チャネルシークレット」の発行を行っておく必要があります。
「Messaging API設定」タブに移動します。
LINEでこのBotをフレンド登録したときに、デフォルトの応答メッセージ、あいさつメッセージが送信されるのですが、今回は不要なので無効化します。
最後に表示される「チャネルアクセストークン」はこのあとLogic Appsにて指定するので控えておきます。
Logic Appsの準備
Azureポータルから任意のリソースグループ内に、Logic Appsを作成します。
HTTPトリガー
トリガーとしてはHTTP要求の受信時(HTTPトリガー)を選択。STREAM DECKの標準プラグイン「システム：Webサイト」を利用しますが、こちらはGETメソッドしか使えないため、Logic Appsの受け口もメソッドの指定を「GET」にします。
JSONの解析
HTTP GETのURLはLogic Appsの保存時に発行されますが、STREAM DECKからこのURLを叩く際にGETパラメータとして最後に「&function=<文字列>」を追加して、STREAM DECKのボタン毎にこのfunctionパラメータの値を変更してLogic Apps側で分岐処理を行えるようにします。
GETメソッドで渡された追加パラメータ「function=XXX」を後続のアクションで容易に取得できるように「JSONの解析」アクションを定義します。
「コンテンツ」には前段のHTTPトリガーで渡されてきたクエリを指定。
スキーマとしては、下記例の様に入力することで、functionパラメータが扱えるようになります。
{ “properties”: { “function”: { “type”: “string” } }, “type”: “object” }
分岐とアクション
パラメータ「function」の値ごとに分岐処理を追加します。
とりあえず “1” と “2” それぞれの値ごとにLINEに送るメッセージ内容をちょっと変えたものを作成します。
HTTPリクエストにてLINEのMessaging APIに対して、broadcast指定でチャネルに登録しているユーザ全てのLINE端末にメッセージを送信しています。
方法は「POST」、URIには「https://api.line.me/v2/bot/message/broadcast」を指定します。
ヘッダーに「Authorization」には「Bearer <先に控えたトークン文字列」を追加、
「Content-Type」には「application/json」を追加します。
本文には以下の形式でLINEに送るメッセージ本文をtext指定で設定します。
{ “messages”: [ { “text”: “Stream Deckのボタン1が押されました”, “type”: “text” } ] }
STREAM DECKの準備
Stream Deckアプリケーションから、「システム：Webサイト」を任意のボタンに割り当てます。
タイトルやアイコンは自由に設定。URLにはLogic AppsのHTTP GETのURLを貼り付け、URLの最後に「&function=1」などパラメータを追加します。
「バックグラウンドでアクセス」はチェックしておきます。
こんな感じに準備ができました（左下）。それぞれのボタン毎にURLのパラメータを「function=1」「function=2」と変えています。
動作確認
それでは、STREAM DECKのボタンを押しましょう。ぽちっ。
ちゃんと実行されたようですね。
LINEにもちゃんとメッセージが送信されました。
無論URLパラメータを変えたもう一つのボタンをぽちぽち押せば、メッセージも切り替わります。
おわりに
今回はSTREAM DECK購入二日目で、まだAzureと連携してのアイデアがない状態でのお試しだったため、単純にLINEに通知するだけの記事でしたが、STREAM DECKからボタン種類を変えてLogic Apps側で分岐が行えることろまでは確認できたので、この仕組をベースに今後色々と楽しいカラクリを作っていきたいと思います。
