如何为浏览器中的ReadableStream.from编写纯JavaScript兼容补丁？

当然有可以临时使用的纯JavaScript兼容实现，完全可以基于原生ReadableStream构造函数，通过迭代器来编写对应的pull和cancel回调逻辑。以下是符合Web标准的兼容实现：

if (!ReadableStream.from) {
  ReadableStream.from = function(source) {
    const iterator = typeof source[Symbol.asyncIterator] === 'function'
      ? source[Symbol.asyncIterator]()
      : source[Symbol.iterator]();

    return new ReadableStream({
      async pull(controller) {
        try {
          const result = await iterator.next();
          if (result.done) {
            controller.close();
          } else {
            controller.enqueue(result.value);
          }
        } catch (err) {
          controller.error(err);
        }
      },
      async cancel(reason) {
        if (typeof iterator.return === 'function') {
          try {
            await iterator.return(reason);
          } catch (err) {
            // 忽略return时的错误
          }
        }
      }
    });
  };
}

实现说明 #

• 自动适配同步迭代器和异步迭代器：先检查是否存在Symbol.asyncIterator，优先使用异步迭代逻辑
• pull回调：每次读取迭代器的下一个值，将其加入流中；当迭代完成时关闭流，遇到错误则标记流为错误状态
• cancel回调：如果迭代器支持return方法，则调用它来清理迭代器资源，符合流的取消语义

内容的提问来源于stack exchange，提问作者Mario Ishac