1

I am using an API that returns a video in the following format:

{
  audio:"data:audio/mp3;base64,//tgx...",
  video:{
    "frames":[
     {"data":"/9j/4AA...","position":0,"time":0.157}, 
     {"data":"/9j/4AA...","position":1,"time":0.105},
     ....
     {"data":"/9j/4AA...","position":n},
    ],
    "fps":9.18,
    "duration":20
  }
}

As you can see in the object the audio and video are separated, the audio in mp3 format and the video in a frame array. How can I put them together and generate a blob file ('.mp4')

If is not possible, How can I generate Blob from frames array

Omar Barrera Valentin
  • 143
  • 14
  • https://github.com/Kagami/ffmpeg.js/ should be able to do it (you may have to decode your base64 jpeg images first), an other solution would be to draw it on a canvas and record its stream. [Here is an example](https://stackoverflow.com/a/58969196/3702797) of non linear recording that you may need if you go this route since loading all the stills at the same time would require a lot of memory, (but first check ffmpeg, sounds like the most straightforward way. Also, are you sure your API can't output a better format than this? Passing still images will blow your bandwidth up. – Kaiido Dec 11 '19 at 02:46

0 Answers0