將自我裝載 Socket.IO 應用程式遷移至 Azure 上進行完全管理

在本文中，您會使用 Web PubSub for Socket.IO，將 Socket.IO 聊天應用程式移轉至 Azure。

重要

原始 連接字串 只針對示範目的出現在本文中。

連接字串包含應用程式存取 Azure Web PubSub 服務所需的授權資訊。 連接字串內的存取金鑰類似於服務的根密碼。 在生產環境中，請一律保護您的存取金鑰。 使用 Azure 金鑰保存庫，安全地管理和輪替密鑰，並使用保護連線WebPubSubServiceClient。

避免將存取金鑰散發給其他使用者、寫入程式碼，或將其以純文字儲存在他人可以存取的位置。 如果您認為金鑰可能已遭盜用，請輪替金鑰。

必要條件

• 具有有效訂用帳戶的 Azure 帳戶。 如果您沒有帳戶，您可以建立免費帳戶。
• 對 Socket.IO 程式庫有一定的了解。

為 Socket.IO 資源建立 Web PubSub

1. 前往 Azure 入口網站。

2. 搜尋 socket.io，然後選取 [Socket.IO 的 Web PubSub]。

3. 選取一個方案，然後選取 [建立]。

   

移轉應用程式

針對本指南中的移轉流程，您可以使用 Socket.IO 網站上提供的範例聊天應用程式。 您必須對伺服器端和用戶端程式碼進行一些小變更，才能完成移轉。

伺服器端

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 金鑰保存庫，安全地管理和輪替密鑰，並使用保護連線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，請在使用之前新增 async，因為它們與 Socket.IO 的 Web PubSub 非同步:

   • 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 入口網站資源中尋找您資源的端點。

   

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",
   });