创建写入流以在没有 Node.js 的情况下下载音频流

Question

我正在尝试在浏览器中使用 ytdl-core 来下载 mp3。我让 ytdl-core 在没有 Node.js 的浏览器中工作，但是在将流保存为文件时遇到了一些问题。一般情况下，您应该有一个客户端/服务器一起执行此操作，但我想知道是否可以全部在客户端完成。

这是我不知道如何使用纯JS重新创建的部分。

fs.createWriteStream('video.flv')

这是我尝试下载为 mp3 的对象：

PassThrough {_readableState: ReadableState, readable: true, _events: {…}, _eventsCount: 2, _maxListeners: undefined, …}
allowHalfOpen: true
destroy: () => { stream._isDestroyed = true; }
readable: true
writable: true
_events: {end: ƒ, prefinish: ƒ}
_eventsCount: 2
_maxListeners: undefined
_readableState: ReadableState {objectMode: false, highWaterMark: 524288, buffer: BufferList, length: 0, pipes: null, …}
_transformState: {needTransform: false, transforming: false, writecb: null, writechunk: null, afterTransform: ƒ, …}
_writableState: WritableState {objectMode: false, highWaterMark: 524288, finalCalled: false, needDrain: false, ending: false, …}
destroyed: (...)
readableHighWaterMark: (...)
writableHighWaterMark: (...)
__proto__: Transform

这是ytdl-core使用Node.js给出的例子。

const fs = require('fs');
const ytdl = require('ytdl-core');
// TypeScript: import ytdl from 'ytdl-core'; with --esModuleInterop
// TypeScript: import * as ytdl from 'ytdl-core'; with --allowSyntheticDefaultImports
// TypeScript: import ytdl = require('ytdl-core'); with neither of the above
 
ytdl('http://www.youtube.com/watch?v=A02s8omM_hI')
  .pipe(fs.createWriteStream('video.flv'));

所以我的问题是，有没有办法将文件流保存在纯 JS 中，然后将文件全部下载到浏览器中？

Answer 1

对于

"This is the part that I don't know how to recreate using pure JS.

fs.createWriteStream('video.flv')

请查看https://developer.mozilla.org/en-US/docs/Web/API/Streams_API

可能会有帮助。

这是来自 MDN 页面的一部分，

Streaming involves breaking a resource that you want to receive over a network down 
into small chunks, then processing it bit by bit. This is something browsers do anyway 
when receiving assets to be shown on webpages — videos buffer and more is gradually 
available to play, and sometimes you'll see images display gradually as more is 
loaded.

But this has never been available to JavaScript before. Previously, if we wanted to 
process a resource of some kind (be it a video, or a text file, etc.), we'd have to 
download the entire file, wait for it to be deserialized into a suitable format, then 
process the whole lot after it is fully received.

With Streams being available to JavaScript, this all changes — you can now start 
processing raw data with JavaScript bit by bit as soon as it is available on the 
client-side, without needing to generate a buffer, string, or blob.