js处理后台返回的流文件

// 假设 fetchAPI 用于获取后台返回的流
fetch('your-backend-endpoint')
  .then(response => {
    if (!response.ok) {
      throw new Error('Network response was not ok');
    }
    // 获取可读流
    const reader = response.body.getReader();
    const contentLength = +response.headers.get('Content-Length');
    let receivedLength = 0; // 已接收的字节数
    let chunks = []; // 存储数据块

    return new Promise((resolve, reject) => {
      // 递归读取流
      function pump() {
        reader.read().then(({ done, value }) => {
          if (done) {
            const blob = new Blob(chunks);
            const url = URL.createObjectURL(blob);
            resolve(url); // 返回文件的URL
            return;
          }

          chunks.push(value);
          receivedLength += value.length;
          console.log(`Received ${receivedLength} of ${contentLength}`);
          pump();
        }).catch(reject);
      }

      pump();
    });
  })
  .then(url => {
    // 创建一个a标签用于下载文件
    const a = document.createElement('a');
    document.body.appendChild(a);
    a.style = 'display: none';
    a.href = url;
    a.download = 'filename.ext'; // 设置下载的文件名
    a.click();
    window.URL.revokeObjectURL(url);
    document.body.removeChild(a);
  })
  .catch(error => {
    console.error('There has been a problem with your fetch operation:', error);
  });