Question

我尝试从网站捕捉一些动画并使用ffmpeg将它们拼接在一起。据我所知，文档startScreencast是要走的路。

如果我明白这一点，我可以用

开始截屏

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

并使用

收听每个传入帧

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

但它永远不会打印出来的东西。所以我认为它没有被召唤。

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

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

这感觉就像一个非高效的黑客。那么有关如何正确使用startScreencast和screencastFrame的任何建议吗？

Answer 1

每个收到的帧也必须被确认。

    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});
    }

链接到github issue以获取详细说明。

Answer 2

我有同样的问题。它没有打印任何内容，因为该过程在接收到第一个帧事件之前已终止，这对我来说很有意义。我通过使该过程至少存活5秒钟来解决了该问题。

这对我有用：

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

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

await new Promise(r => setTimeout(r, 5000)); // wait 5 seconds

这样，我们不需要任何循环。

请注意，它也对我有用，无需确认每一帧。

在我的机器上，帧速率非常低（尽管以60 FPS的速度进行了chrome渲染，但帧速率约为10fps）。也许它只发送实际上具有不同内容的每个帧。

无头镀铬捕捉屏幕视频或动画

2 个答案: