ReadableStream.getReader()

ReadableStream インターフェイスの getReader() メソッドはリーダーを作成し、それでストリームをロックします。 ストリームがロックされている間は、このリーダーが開放されるまで他のリーダーを取得できません。

構文

var reader = readableStream.getReader({mode});

パラメーター

{mode} Optional
プロパティ mode を含むオブジェクト。 mode は作成するリーダーのタイプを指定する DOMString を値として受け取ります。 値は次のとおりです。
  • "byob"。 これにより、読み取り可能なバイトストリームを読み取ることができる ReadableStreamBYOBReader が作成されます(つまり、「独自のバッファーを持ち込む」読み取りを処理できます)。
  • undefined(またはまったく指定されていない — これがデフォルトです)。 これにより、ストリームから個々のチャンクを読み取ることができる ReadableStreamDefaultReader が作成されます。

戻り値

mode 値に応じて、ReadableStreamDefaultReader または ReadableStreamBYOBReader オブジェクトのインスタンス。

例外

RangeError
指定された mode 値は "byob" または undefined ではありません。
TypeError
リーダーを作成しようとしているストリームは ReadableStream ではありません。

次の簡単な例では、getReader() を使用して作成した ReadableStreamDefaultReader を使用して、以前に作成したカスタムの ReadableStream を読み取ります(完全なコードについては、単純なランダムストリームの例を参照)。 各チャンクを順番に読み取り、ストリームの読み取りが完了するまで UI に出力します。 ストリームの読み取りが完了すると、再帰関数から戻り、ストリーム全体を UI の別の部分に出力します。

function fetchStream() {
  const reader = stream.getReader();
  let charsReceived = 0;

  // read() は、値を受け取ったときに解決する promise を返します
  reader.read().then(function processText({ done, value }) {
    // 結果オブジェクトには2つのプロパティが含まれます。
    // done  - ストリームがすべてのデータを既に提供している場合は true。
    // value - 一部のデータ。 done が true の場合、常に undefined。
    if (done) {
      console.log("Stream complete");
      para.textContent = value;
      return;
    }

    // フェッチしたストリームの値は Uint8Array です
    charsReceived += value.length;
    const chunk = value;
    let listItem = document.createElement('li');
    listItem.textContent = 'Received ' + charsReceived + ' characters so far. Current chunk = ' + chunk;
    list2.appendChild(listItem);

    result += chunk;

    // さらに読み、この関数を再度呼び出します
    return reader.read().then(processText);
  });
}

仕様

仕様 状態 コメント
Streams
getReader() の定義
現行の標準 初期定義

ブラウザーの互換性

Update compatibility data on GitHub
デスクトップモバイル
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewAndroid 版 ChromeAndroid 版 FirefoxAndroid 版 OperaiOSのSafariSamsung Internet
getReader
実験的
Chrome 完全対応 43Edge 完全対応 14Firefox 完全対応 65
完全対応 65
完全対応 57
無効
無効 From version 57: this feature is behind the dom.streams.enabled preference (needs to be set to true) and the javascript.options.streams preference (needs to be set to true). To change preferences in Firefox, visit about:config.
IE 未対応 なしOpera 完全対応 30Safari 完全対応 10.1WebView Android 完全対応 43Chrome Android 完全対応 43Firefox Android 完全対応 65
完全対応 65
完全対応 57
無効
無効 From version 57: this feature is behind the dom.streams.enabled preference (needs to be set to true) and the javascript.options.streams preference (needs to be set to true). To change preferences in Firefox, visit about:config.
Opera Android 完全対応 30Safari iOS 完全対応 10.3Samsung Internet Android 完全対応 4.0

凡例

完全対応  
完全対応
未対応  
未対応
実験的。動作が変更される可能性があります。
実験的。動作が変更される可能性があります。
ユーザーが明示的にこの機能を有効にしなければなりません。
ユーザーが明示的にこの機能を有効にしなければなりません。