0

我正在尝试从节点画布内的多个帧生成 WEBM 视频。

const canvas = require('canvas');
const sharp = require('sharp');
const WebMWriter = require("webm-writer");
const fs = require('fs');
async function generate(){
    var cnv = canvas.createCanvas(500,500);
    var c = cnv.getContext('2d');

    let frames = [];
    for(let i = 0; i < 10; i++){
        c.clearRect(0,0,500,500);
        c.fillStyle="#FF0000";
        c.fillRect(Math.random()*500,Math.random()*500,50,50);
        let frame = await sharp(cnv.toBuffer()).webp({force:true}).toBuffer();
        frames.push(`data:image/webp;base64,${frame.toString('base64')}`);
    }
    
    let writer = new WebMWriter({
        quality:0.99,
        frameDuration:200,
        transparent:false
    })

    for(let frame of frames) writer.addFrame(frame);

    let blob = await writer.complete(); // returns a Node v15.7.0 Blob instance
    let arrayBuffer = await blob.arrayBuffer();
    let buf = new Buffer.from(arrayBuffer);
    fs.writeFile("test.webm",buf,'base64',()=>{
        console.log("File saved.");
    });
}
generate();

上面的代码在屏幕周围创建了一个随机矩形的短视频。但是,生成的 webm 文件无法在 Windows 媒体播放器中播放,在使用移动设备时也无法在 Discord 中播放。我相信这是由缓冲区和 blob 转换以及缓冲区丢失其 mime 类型引起的。

是否有任何解决方法可以让它在任何地方播放?

编辑 1:通过阅读这个问题,我尝试在生成的视频上使用 ffmpeg 并且它可以工作,但是我不希望使用它,因为它会增加执行时间的额外延迟。

ffmpeg -i test.webm -qscale 0 test_altered.webm
4

0 回答 0