Javascript 使用MediaRecorder将文件另存为GIF

我正在做一个屏幕截图程序。目前，它正在将窗口的输出保存为

webm

。我想知道是否可以使用MediaRecorder将其保存为GIF格式，这是本机的一部分

或者我必须依赖外部插件（如FFMPEG）来进行转换吗？如果能够将其直接保存为GIF，那就太好了

当我将

mimeType

更改为

image/gif；codecs=vp9

并将文件输出到

.gif

。录音没有产生任何输出（也没有错误）。由于MediaRecorder在撰写本文时是全新的，因此没有太多可用的信息

这是我的一段代码，类名为

Recorder

：

public static readonly mimeType: string = "video/webm; codecs=vp9";
public mediaRecorder?: MediaRecorder;
public videoElement: HTMLVideoElement = <HTMLVideoElement>document.querySelector("video");
...

async selectSource(source: Electron.DesktopCapturerSource): Promise<any> {
    ...
    const stream = await navigator.mediaDevices.getUserMedia(<MediaStreamConstraints>constraints);
    this.videoElement.srcObject = stream;

    const streamOptions = { mimeType: `${Recorder.mimeType}` };

    this.mediaRecorder = new MediaRecorder(stream, streamOptions);
    this.mediaRecorder.ondataavailable = () => this.storeAvailableData;
    this.mediaRecorder.onstop = () => this.saveRecording();
}

storeAvailableData(e:any): void {
    console.log("video data available");
    this.recordedChunks.push(e.data);
}

async saveRecording(): Promise<any> {
    //blob is of type any due to @typings not yet updated.
    const blob:any = new Blob(this.recordedChunks, {
        type: `${Recorder.mimeType}`
    });

    const buffer = Buffer.from(await blob.arrayBuffer());

    const { filePath } = await this.dialog.showSaveDialog({
        buttonLabel: "Save video",
        defaultPath: `vid-${Date.now()}.webm`
    });

    if (filePath) {
        writeFile(filePath, buffer, () => console.log("video saved!"));
    }
}

publicstatic只读mimeType:string=“video/webm；codecs=vp9”；
公共媒体录制器？：媒体录制器；
public videoElement:HTMLVideoElement=document.querySelector（“视频”）；
...
异步选择源（源：Electron.DesktopCapturerSource）：承诺

文档/规范现在更加完整了。但是，GIF选项仍然不可用。
可能会对您有所帮助，它是一个用js记录GIF文件的库。您可以每秒30次从视频源抓取图像，并将其推送到gif.js实例中。@LukasBach谢谢，如果排除MediaRecorder，我可能会考虑其他选择。现在我特别询问有关MediaRecorder的问题。