Html5 amp story convert to mo4 video

Question

What is best practice to convert html5 and css3 animation or amp-stories to mp4 video?

Is there any library which can do this out of the box?

https://stackoverflow.com/questions/4618048/best-way-to-create-video-from-html5-animation — Lasse Edsvik, Jun 23 '19 at 18:16

score 0 · Answer 1 · answered Jun 23 '19 at 18:12

0

What I've done in the past is utilize Chrome's Tab Capture API.

https://developers.chrome.com/extensions/tabCapture

Basically, you build a browser extension and create a media stream and Media Recorder. Something like this:

const mediaStream = chrome.tabCapture.captureOffscreenTab('https://example.com', {
  audio: true,
  video: true,
  videoConstraints: {
    width: 1280,
    height: 960
  }
});

Then, use MediaRecorder to capture the output and save it, in the same way you would any other MediaStream.

answered Jun 23 '19 at 18:12

Brad

159,648
54
349
530

@DejanMilosevic Yes, hence `audio: true`. – Brad Jun 23 '19 at 19:40
And how would I target specific start moment and specific end moment? For example begining and end of amp-story? – Dejan Milosevic Jun 23 '19 at 19:45
You can use postMessage to send data between the extension and your page. https://developers.chrome.com/extensions/messaging That way, you can tell it when to start/stop recording. – Brad Jun 23 '19 at 20:05

Html5 amp story convert to mo4 video

1 Answers1