0

クライアント側のみに基づいて、再開可能なファイル ダウンローダーを作成しようとしています。サーバーは私の制御を超えており、ajax 要求で、非常に大きなバイナリ データ ファイル (100mgb) であるファイルを取得します。

長い調査の結果、xhr要素を使用して応答をストリーミングすることはできず、完全にキャッシュされる前にファイルのチャンクを読み取ることができないことがわかりました...さらに調べて、まったく新しいフェッチAPIを見つけましたが、できません適切なドキュメントやチュートリアルを見つけてください。URLをフェッチしてストリームをチャンクごとに読み取る簡単な例を誰かが説明できれば、非常にありがたいです

4

1 に答える 1

1

このブログ投稿の例を次に示します。

fetch('/big-data.csv').then(function(response) {
  var reader = response.body.getReader();
  var partialCell = '';
  var returnNextCell = false;
  var returnCellAfter = "Jake";
  var decoder = new TextDecoder();

  function search() {
    return reader.read().then(function(result) {
      partialCell += decoder.decode(result.value || new Uint8Array, {
        stream: !result.done
      });

      // Split what we have into CSV 'cells'
      var cellBoundry = /(?:,|\r\n)/;
      var completeCells = partialCell.split(cellBoundry);

      if (!result.done) {
        // Last cell is likely incomplete
        // Keep hold of it for next time
        partialCell = completeCells[completeCells.length - 1];
        // Remove it from our complete cells
        completeCells = completeCells.slice(0, -1);
      }

      for (var cell of completeCells) {
        cell = cell.trim();

        if (returnNextCell) {
          reader.cancel("No more reading needed.");
          return cell;
        }
        if (cell === returnCellAfter) {
          returnNextCell = true;
        }
      }

      if (result.done) {
        throw Error("Could not find value after " + returnCellAfter);
      }

      return search();
    })
  }

  return search();
}).then(function(result) {
  console.log("Got the result! It's '" + result + "'");
}).catch(function(err) {
  console.log(err.message);
});

ストリーミング レスポンスはまだすべてのブラウザーでサポートされているわけではないことに注意してください。 MDN の互換性テーブルを確認してください。

于 2016-03-01T22:09:47.793 に答える