このページはコミュニティーの尽力で英語から翻訳されました。MDN Web Docs コミュニティーについてもっと知り、仲間になるにはこちらから。

View in English Always switch to English

WebSocketStream

Experimental: これは実験的な機能です。
本番で使用する前にブラウザー互換性一覧表をチェックしてください。

メモ: この機能はウェブワーカー内で利用可能です。

WebSocketStreamWebSockets API のインターフェイスで、WebSocket サーバーに接続するためのプロミスベースの API です。接続上でデータを送信および受信するためにストリームを使用するため、自動的にストリームの[背圧]backpressureを活用し、読み取りや書き込みの速度を調整することでアプリケーションのボトルネックを避けることができます。

コンストラクター

WebSocketStream() Experimental

新しい WebSocketStream オブジェクトインスタンスを生成します。

インスタンスプロパティ

url 読取専用 Experimental

WebSocketStream インスタンスが作成された WebSocket サーバーの URL を返します。

closed 読取専用 Experimental

ソケット接続が閉じられた際に、オブジェクトで解決される Promise を返します。このオブジェクトには、サーバーから送信された接続終了コードと理由が含まれています。

opened 読取専用 Experimental

ソケット接続が正常に開かれた時点で、オブジェクトを返す Promise が履行されます。このオブジェクトには、接続上でデータを受信・送信するための ReadableStreamWritableStream のインスタンスが含まれています。

インスタンスメソッド

close() Experimental

WebSocket 接続を閉じます。

js
const output = document.querySelector("#output");

function writeToScreen(message) {
  const pElem = document.createElement("p");
  pElem.textContent = message;
  output.appendChild(pElem);
}

if (!("WebSocketStream" in self)) {
  writeToScreen("このブラウザーは WebSocketStream に対応していません");
} else {
  const wsURL = "ws://127.0.0.1/";
  const wss = new WebSocketStream(wsURL);

  console.log(wss.url);

  async function start() {
    const { readable, writable, extensions, protocol } = await wss.opened;
    writeToScreen("CONNECTED");
    closeBtn.disabled = false;
    const reader = readable.getReader();
    const writer = writable.getWriter();

    writer.write("ping");
    writeToScreen("SENT: ping");

    while (true) {
      const { value, done } = await reader.read();
      writeToScreen(`RECEIVED: ${value}`);
      if (done) {
        break;
      }

      setTimeout(() => {
        writer.write("ping");
        writeToScreen("SENT: ping");
      }, 5000);
    }
  }

  start();
}

完全な説明を付けている完成する例については、 WebSocketStream でクライアントを書く を参照してください。

仕様書

現在、どの仕様にも属していません。標準化の進捗状況については https://github.com/whatwg/websockets/pull/48 を参照してください。

ブラウザーの互換性

関連情報