FIXER cloud.config Tech Blog

Azure Web PubSubでリアルタイムメッセージングアプリを作ろう

2021年05月21日 11時00分更新

文● 櫻井正雄／FIXER

　本記事はFIXERが提供する「cloud.config Tech Blog」に掲載された「Azure Web PubSub でリアルタイムメッセージングアプリを作ろう #Azure リレー」を再編集したものです。

　今回は4月29日にAzure Web PubSubというサービスがプレビューで提供されたのでその紹介になります。まずはサービスの紹介から始めていきましょう。

Azure Web PubSubとは？
Azure Web PubSubで推奨されるアプリケーション
 利用できるリージョン
 Azure Web PubSubを動かしてみよう！
料金は？
まとめ

Azure Web PubSubとは？

　Azure Web PubSubの名前の由来となっているのは、Publish/Subscribeモデルです。Wikipeidaでは、「出版-購読型モデル（しゅっぱん-こうどくがたモデル、英: Publish/subscribe）は、非同期メッセージングパラダイムの一種であり、メッセージの送信者（出版側）が特定の受信者（購読側）を想定せずにメッセージを送るようプログラムされたものである。」（出典）と定義されています。

　Azure アーキテクチャーセンターだと以下のような絵がありイメージしやすいかもしれません。

　出典）パブリッシャーとサブスクライバーのパターン

　・データを送信したいサービスは、発行元になりメッセージブローカーにデータを登録する。
　・データを受信したいサービスは、サブスクライバーとなりメッセージブローカーからデータを取得する。
　・メッセージブローカーはキューです。こうすることでサービス同士が疎結合にでき、ソフトウェアをスケーラブルに構成できます。

　このように、Azure Web PubSubはWebSocketとパブリッシュ/サブスクライブパターンで、リアルタイムメッセージングWebアプリケーションを実行するためのフルマネージドのサービスです。同時接続性にも優れており最大10万同時接続に耐えるサービスです。

Azure Web PubSubで推奨されるアプリケーション

　マイクロソフトのドキュメントで紹介されているアプリケーションの一覧です。大量にリアルタイムに情報を連携する必要のあるサービスに向いているというのがわかります。

分類	利用アプリケーション
高頻度データアップデート	・ゲーム・投票・調査・オークション
ライブダッシュボードやモニタリング	・企業ダッシュボード・金融マーケットデータ・営業情報の即時更新・マルチプレイヤーゲームのランキングボード・IOTモニタリング
クロスプラットフォームライブチャット	・ライブチャットルーム・チャットボット・オンラインカスタマーサポート・リアルタイムショッピングアシスタント・メッセンジャー・ゲーム内チャット
リアルタイムロケーションマップ	・物流追跡・配送状況追跡・物流ステータスアップデート・GPSアプリ
コラボレーションアプリ	・共同編集・ホワイトボード・チームミーティングアプリ
即時プッシュ通知	・ソーシャル・ネットワーク・Eメール・ゲーム・旅行アラート
リアルタイム配信	・リアルタイムオーディオ・ビデオ配信・ライブキャプション・同時通訳・イベント・ニュース配信
IoTや接続デバイス	・リアルタイムIoTメトリック・リモートコントロール・リアルタイムステータス・ロケーション追跡
自動化	・イベントのリアルタイムトリガー

　（出典）https://azure.github.io/azure-webpubsub/getting-started/introduction#overview

利用できるリージョン

　プレビューのため利用できるリージョンが制限されています。現時点での利用できるリージョンは以下の通り。

　・Southeast Asia
　・North Europe
　・West Europe
　・East US
　・West US2

　※2021年5月2日時点の情報になります。

Azure Web PubSubを動かしてみよう！

　それでは早速動作させてみましょう。まずはポータルでWeb PubSubを検索して作成を選択。

　作成するリソースグループを選択し、リソース名、リージョン、料金プラン、ユニット数を設定し作成する。

　1分20秒待ったら、出来上がり。

　因みになぜか、リソースグループのリソース一覧には、Web PubSubのリソースは表示されませんでした。

　翌日見たら見えるようになっていました。

　今回はポータルで作成しましたが、ちゃんとCLIも準備されていました。


~$ az webpubsub -h
The command requires the extension webpubsub. Do you want to install it now? The command will continue to run after the extension is installed. (Y/n): Y
Run 'az config set extension.use_dynamic_install=yes_without_prompt' to allow installing extensions without prompt.
The installed extension 'webpubsub' is in preview.

Group
    az webpubsub : Commands to manage Webpubsub.
        This command group is in preview and under development. Reference and support levels:
        https://aka.ms/CLI_refstatus
Subgroups:
    event-handler : Commands to manage Webpubsub event handler settings.
    key           : Commands to manage Webpubsub keys.
    network-rule  : Commands to manage Webpubsub network rules.

Commands:
    create        : Create a Webpubsub.
    delete        : Delete a Webpubsub.
    list          : List Webpubsub.
    restart       : Restart a Webpubsub.
    show          : Show details of a Webpubsub.
    update        : Update a Webpubsub.

For more specific examples, use: az find "az webpubsub"

Please let us know how we are doing: https://aka.ms/azureclihats

　CLIの説明ページ

　それでは早速、チャットを動かしていきましょう！キーブレードに遷移して、クライアント接続用のURLを発行しましょう。そして、追加でRoleとして、グループにイベントを送る権限とグループに参加する権限を付与してください。

　接続情報が手に入ったので、デモ用のクライアントに接続してみます。以下のリンクにデモアプリがありますので、取得した接続情報を設定してみましょう。

　https://azure.github.io/azure-webpubsub/demos/clientpubsub.html

　Client Access URLを設定して、Connectを選択するとクライアントアプリケーションが、Web PubSubにすぐに接続されます。Join Groupに好きなグループ名を記載してJoinを選択するとそのグループに参加できます。

　Publish to Groupにグループ名を、メッセージエリアにテキストを入力してSendを選択するとメッセージがパブリッシュされ、グループにJoinしていれば受信エリアに送信したテキストが表示されます。

　つまり、右がパブリッシャー、左がサブスクライバーの設定ですね。

　あっという間に、チャットアプリが動きました。後はメトリックの確認を確認してみましょう。同時接続数の最大やアウトバウンドのトラフィックが確認できます。

　Diagnostic Settingsは、Live Trace Settingsとして提供されます。

　Live Trace Settingsの接続は、Azure PubSubのクライアント接続となるのでご注意下さい。

料金は？

　Web PubSubサービスの料金は、FREEプランとStandardプランの2つです。

項目	FREEプラン	Standardプラン
ユニットあたりの同時接続数	20	1,000
メッセージ／ユニット／日	20,000	制限なし（100万メッセージまでは無料）
料金／ユニット／日	無料	180.320円
最大ユニット数	1	100