セルフホステッド Socket.IO アプリを Azure 上のフル マネージドに移行する

この記事では、Web PubSub for Socket.IO を使用して、Socket.IO チャット アプリを Azure に移行します。

前提条件

Web PubSub for Socket.IO リソースを作成する

1. Azure portal に移動します。

2. socket.io を検索し、[Web PubSub for Socket.IO] を選択します。

3. プランを選択し、[作成] を選択します。

   

アプリを移行する

このガイドの移行プロセスでは、Socket.IO の Web サイトで提供されているサンプル チャット アプリ使用します。 移行を完了するには、サーバー側とクライアント側の両方のコードにいくつかの軽微な変更を加える必要があります。

サーバー側

1. サーバー側コードで index.js を見つけます。

2. @azure/web-pubsub-socket.io パッケージを追加します。

   npm install @azure/web-pubsub-socket.io
   

3. パッケージをインポートします。

   const { useAzureSocketIO } = require("@azure/web-pubsub-socket.io");
   

4. Socket.IO サーバーを作成したサーバー側コードを見つけて、useAzureSocketIO(...) を追加します。

   この記事に示す生の接続文字列は、デモンストレーションのみを目的としています。 運用環境では、常にアクセス キーを保護してください。 Azure Key Vault を使ってキーの管理とローテーションを安全に行い、WebPubSubServiceClient を使って接続をセキュリティ保護します。

   const io = require("socket.io")();
   useAzureSocketIO(io, {
       hub: "eio_hub", // The hub name can be any valid string.
       connectionString: process.argv[2]
   });
   

   重要

   useAzureSocketIO メソッドは非同期であり、Web PubSub に接続するための初期化手順を実行します。 await useAzureSocketIO(...) を使用するか、useAzureSocketIO(...).then(...) を使用して、初期化が成功した後にアプリ サーバーで要求の処理を開始することを確認できます。

5. 次のサーバー API を使用する場合は、Web PubSub for Socket.IO と非同期であるため、使用する前に async を追加します。

   • server.socketsJoin
   • server.socketsLeave
   • socket.join
   • socket.leave

   たとえば、次のようなコードがある場合:

   io.on("connection", (socket) => { socket.join("room abc"); });
   

   次のように更新します。

   io.on("connection", async (socket) => { await socket.join("room abc"); });
   

   このチャットの例では、これらの API は使用しません。 そのため、変更する必要はありません。

クライアント側

1. Azure portal でリソースへのエンドポイントを見つけます。

   

2. クライアント側コードの ./public/main.js に移動します。

3. Socket.IO クライアントが作成される場所を見つけます。 そのエンドポイントを Azure の Socket.IO エンドポイントに置き換え、path オプションを追加します。

   const socket = io("<web-pubsub-for-socketio-endpoint>", {
       path: "/clients/socketio/hubs/eio_hub",
   });