跳到主要內容

WebSocketRoute

每當使用 page.routeWebSocket() 或 browserContext.routeWebSocket() 設定 WebSocket 路由時，WebSocketRoute 物件允許處理 WebSocket，就像實際的伺服器一樣。

Mocking

預設情況下，路由的 WebSocket 不會連線到伺服器。 這樣，您可以模擬 WebSocket 上的整個通訊。 這是一個範例，回應 "request" 和 "response"。

await page.routeWebSocket('wss://example.com/ws', ws => {
  ws.onMessage(message => {
    if (message === 'request')
      ws.send('response');
  });
});

由於我們沒有在 WebSocket 路由處理器內呼叫 webSocketRoute.connectToServer()，Playwright 假設 WebSocket 將被模擬，並自動在頁面內開啟 WebSocket。

這是另一個處理 JSON 訊息的範例

await page.routeWebSocket('wss://example.com/ws', ws => {
  ws.onMessage(message => {
    const json = JSON.parse(message);
    if (json.request === 'question')
      ws.send(JSON.stringify({ response: 'answer' }));
  });
});

攔截

或者，您可能想要連線到實際的伺服器，但在中間攔截訊息並修改或封鎖它們。 呼叫 webSocketRoute.connectToServer() 會傳回伺服器端的 WebSocketRoute 實例，您可以將訊息傳送至該實例，或處理傳入的訊息。

以下範例修改了頁面傳送到伺服器的一些訊息。 從伺服器傳送到頁面的訊息保持不變，依賴預設轉發。

await page.routeWebSocket('/ws', ws => {
  const server = ws.connectToServer();
  ws.onMessage(message => {
    if (message === 'request')
      server.send('request2');
    else
      server.send(message);
  });
});

連線到伺服器後，預設情況下，所有訊息都會在頁面和伺服器之間轉發。

但是，如果您在原始路由上呼叫 webSocketRoute.onMessage()，則從頁面到伺服器的訊息將不再轉發，而是應由 handler 處理。

同樣地，在伺服器端 WebSocket 上呼叫 webSocketRoute.onMessage() 將停止轉發訊息從伺服器到頁面，而 handler 應負責處理它們。

以下範例封鎖了兩個方向的一些訊息。 由於它在兩個方向都呼叫了 webSocketRoute.onMessage()，因此根本沒有自動轉發。

await page.routeWebSocket('/ws', ws => {
  const server = ws.connectToServer();
  ws.onMessage(message => {
    if (message !== 'blocked-from-the-page')
      server.send(message);
  });
  server.onMessage(message => {
    if (message !== 'blocked-from-the-server')
      ws.send(message);
  });
});

方法​

close​

Added in: v1.48 webSocketRoute.close

關閉 WebSocket 連線的其中一端。

用法

await webSocketRoute.close();
await webSocketRoute.close(options);

引數

傳回

connectToServer​

Added in: v1.48 webSocketRoute.connectToServer

預設情況下，路由的 WebSocket 不會連線到伺服器，因此您可以模擬整個 WebSocket 通訊。 此方法會連線到實際的 WebSocket 伺服器，並傳回伺服器端的 WebSocketRoute 實例，讓您能夠從伺服器傳送和接收訊息。

連線到伺服器後

請參閱頂部的範例以取得更多詳細資訊。

用法

webSocketRoute.connectToServer();

傳回

onClose​

Added in: v1.48 webSocketRoute.onClose

允許處理 WebSocket.close。

預設情況下，關閉連線的一端（無論是在頁面中還是在伺服器上）都會關閉另一端。 但是，當設定 webSocketRoute.onClose() 處理常式時，關閉的預設轉發會停用，而處理常式應負責處理它。

用法

webSocketRoute.onClose(handler);

引數

onMessage​

Added in: v1.48 webSocketRoute.onMessage

此方法允許處理由 WebSocket 傳送的訊息，無論是從頁面還是從伺服器。

當在原始 WebSocket 路由上呼叫時，此方法會處理從頁面傳送的訊息。 您可以透過使用 webSocketRoute.send() 回應這些訊息、將它們轉發到 webSocketRoute.connectToServer() 傳回的伺服器端連線，或執行其他操作來處理這些訊息。

一旦呼叫此方法，訊息將不會自動轉發到伺服器或頁面 - 您應該透過呼叫 webSocketRoute.send() 手動執行此操作。 請參閱頂部的範例以取得更多詳細資訊。

再次呼叫此方法將會使用新的處理常式覆寫處理常式。

用法

webSocketRoute.onMessage(handler);

引數

send​

Added in: v1.48 webSocketRoute.send

將訊息傳送到 WebSocket。 當在原始 WebSocket 上呼叫時，將訊息傳送到頁面。 當在 webSocketRoute.connectToServer() 的結果上呼叫時，將訊息傳送到伺服器。 請參閱頂部的範例以取得更多詳細資訊。

用法

webSocketRoute.send(message);

引數

url​

Added in: v1.48 webSocketRoute.url

在頁面中建立的 WebSocket 的 URL。

用法

webSocketRoute.url();

傳回