How to extract files when exporting as a group of pictures? / 当以图片组输出时如何获取这些文件？

[Jveshi]

I am working on the video upload function, in which ffmpeg.wasm is used for video encode. The function of video encode has been realized. There is also a function to generate video thumbnails, which needs to be completed. The video player uses the DPlayer. The player's requirement for thumbnails is to capture sprite images of 100 pictures. So I want to output a picture group, but I can't extract these files, How to solve it? the relevant code is below.

我正在做视频上传功能，其中视频压制这方面使用了 ffmpeg.wasm。视频压制的功能已经实现了，还有一个生成视频缩略图thumbnails的功能，需要完成。 视频播放器使用了 DPlayer，播放器对thumbnails的要求是截取了100张图片的雪碧图。因此我想要输出图片组，可是我无法提取这些文件，相关代码在下方，求教谢谢。

---

//The length of the test video is 160 seconds
ffmpeg -i ../../test.mp4 -vf fps=1/(160/100) ../../thumbnail/thumbnail%d.png

var in_name = "upload.mp4";
var out_name = "thumbnail%d.png";

(async () => {
    await ffmpeg.load();
    ffmpeg.FS('writeFile', in_name, await fetchFile(original_video_file));
    await ffmpeg.run('-i', in_name, '-vf' , 'fps=1/(160/100)' , out_name);
    var new_file = ffmpeg.FS('readFile', out_name);
    var thumbnail = new Blob([new_file.buffer], { type: 'image/png' });
    console.log(thumbnail);
})();

The error reported by the above code is / 以上代码的报错是 Uncaught (in promise) Error: ffmpeg.FS('readFile', 'thumbnail%d.png') error. Check if the path exists

[Jveshi]

I found a way, if it should be like this when getting the file according to the original code.

ffmpeg.FS('readFile', 'thumbnails1.png');
ffmpeg.FS('readFile', 'thumbnails2.png');
ffmpeg.FS('readFile', 'thumbnails3.png');

Then you can create a new directory first and specify the output here. ffmpeg.FS('mkdir','/thumbnails');

var in_name = "upload.mp4";
var out_name = "thumbnails/thumbnails%d.png";

(async () => {
    await ffmpeg.load();
    //First create a thumbnails directory in the file system
    ffmpeg.FS('mkdir','/thumbnails');
    ffmpeg.FS('writeFile', in_name, await fetchFile(original_video_file));
    await ffmpeg.run('-i', in_name, '-vf' , 'fps=1/(160/100)' , out_name);

    //Read the contents of the specified folder
    console.log(ffmpeg.FS('readdir', '/thumbnails'));
    //view first image
    var new_file = ffmpeg.FS('readFile', 'thumbnails/thumbnails1.png');
    console.log(new Blob([new_file.buffer], { type: 'image/png' }));
})();

If you can find the first picture, the rest will not be a problem.