无头镀铬捕获屏幕视频或动画 [英] headless chrome capture screen video or animation

问题描述

我尝试从网站上捕获一些动画并使用 ffmpeg 将它们拼接在一起.据我了解文档 startScreencast 是去吧.

如果我理解正确，我可以用

开始截屏视频

await Page.startScreencast({format: 'png', everyNthFrame: 1});

并使用

收听每个传入的帧

Page.screencastFrame(image =>{const {数据，元数据} = 图像；控制台日志(元数据)；});

但它永远不会打印出任何东西.所以我假设它没有被调用.

我用这样的东西归档了我的目标:

let counter = 0;而(计数器<500){等待 Page.startScreencast({format: 'png', everyNthFrame: 1});const {data, metadata} = await Page.screencastFrame();控制台日志(元数据)；计数器 += 1;}

这感觉就像一个性能不佳的黑客.那么对于如何正确使用 startScreencast 和 screencastFrame 有什么建议吗?

解决方案

每个接收到的帧也必须得到确认.

 await Page.navigate({url: 'http://www.goodboydigital.com/pixijs/examples/12-2/'});等待 Page.loadEventFired();等待 Page.startScreencast({format: 'png', everyNthFrame: 1});让计数器 = 0;而(计数器<100){const {data, metadata, sessionId} = await Page.screencastFrame();控制台日志(元数据)；等待 Page.screencastFrameAck({sessionId: sessionId});}

链接到 github 问题以获得详细说明.>

I try to capture some animations from a website and stitch them together using ffmpeg. As far as I understand the docs startScreencast is the way to go.

If I understand that right I can start the screencast with

await Page.startScreencast({format: 'png', everyNthFrame: 1});

and listen to every incoming frame with

Page.screencastFrame(image =>{
  const {data, metadata} = image;
  console.log(metadata);
});

But it's never prints out something. So I assume it's not called.

I archived my goal with something like this:

let counter = 0;
while(counter < 500){
  await Page.startScreencast({format: 'png', everyNthFrame: 1});
  const {data, metadata} = await Page.screencastFrame();
  console.log(metadata);
  counter += 1;
}

Which feels like a non-performant hack. So any suggestions on how to use startScreencast and screencastFrame properly?

解决方案

Every received frame also has to be acknowledged.

    await Page.navigate({url: 'http://www.goodboydigital.com/pixijs/examples/12-2/'});
    await Page.loadEventFired();
    await Page.startScreencast({format: 'png', everyNthFrame: 1});

    let counter = 0;
    while(counter < 100){
      const {data, metadata, sessionId} = await Page.screencastFrame();
      console.log(metadata);
      await Page.screencastFrameAck({sessionId: sessionId});
    }

link to github issue for detailed explanation.

这篇关于无头镀铬捕获屏幕视频或动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！