Vanilagy/webm-muxer

Use without Video Encoder API?

Closed this issue · 5 comments

This is not a bug report or anything wrong with your library, more like a request for help. I would be glad to take this into a private communication and also pay for help, I saw no other way to get in touch other than opening this issue.

I am working on a project that involves recording from an end users webcam via a stream from navigator.mediaDevices.getUserMedia and piping that into a MediaRecorder. I am seeking a browser based solution that creates videos in one filetype that is then playable in all other browsers. I have found that if I record videos in webm in Chrome they will not play in Safari. I can however get other webms to play in Safari.

I found that I can use MP4 instead by setting mimeType: 'video/mp4; codecs=avc1.640028,mp4a.40.2' on the MediaRecorder. The issue with this is concerns around the H264 license.

I was looking at your library and it seems that videos created in Chrome are then playable in Safari. I am having trouble figuring out how to use it though as the examples mostly use the VideoEncoder API and none I saw use the getUserMedia or MediaRecorder API's. Is it possible to use this library to create valid webm files with either of these browser apis getUserMedia or MediaRecorder?

Thanks so much for any help or guidance you can provide.

Hi there, just came across this repo and I am working on my thesis project that requires the use of WebCodes for streaming(encoding and decoding), and I got some ideas that might help.

The thing you cannot play on Safari with some webms, mostly it's sth related to codecs used in the encoder setup, and WebCodecs are new and Safari just does not support well (tbf, Safari sucks when it comes to new API support, use Chrome whenever you can, Safari is not really for web app testing), and when you record through Chrome, you might need to take care on the codecs if you wanna the end file be playable on all platforms such as Safari, and as you said you can use H264 but there might be license issue. I would recommend to find thrid party lib that do post processing on converting videos to another codec etc., tools like mp4box.js might give you some hints on this.

Usage of getUSerMedia, actually there's a demo in the repo here, check MDN's WebCodecs API, great documentation with examples. Good luck🤞

Edit: meta has an implementation that use webcodecs for encoding and decoding, and I think it's really helpful for you to understand the workflow around WebCodecs that involves media capturing, encoding, decoding and playback. My supervisor suggested me to look up this repo but more on the syncing video with audio.

@Ender-Wang thank you for your reply and best of luck with your thesis, this is a very interesting topic! Thank you for sharing these links, especially the Meta one, I hadn't seen that one yet.

Re: Safari sucking, yes, lol, but unfortunately we will see traffic from iphone and want to make sure the videos play no matter which browser they were created in.

Hi! Is it just me or is this title not really related to the content of the post? It feels like this post is more about if this library can be used with media streams.

To that, yes! You'll need to use MediaStreamTrackProcessor like I do in the demo. However, if all you do is record media streams, it'll probably be easier to use MediaRecorder directly than to use this library. It has better support than the Web Codecs API. And personally, I wouldn't worry about the H.264 licensing. That codec is so utterly ubiquitous nowadays that enforcing any distribution license is basically impossible. The license is more relevant for people who write encoders/decoders.

I'll close this issue but feel free to keep the conversation going.

@Vanilagy thank you so much for your reply!

Is it just me or is this title not really related to the content of the post?

Definitely true, apologies! I never got to why I dont want to use the Video Encoder API which is because we want to support as many users/browsers as possible.

it'll probably be easier to use MediaRecorder directly than to use this library

This is what we are currently doing but can't get videos recorded in Chrome to play in Safari, unless we use the h264 codec or run them through ffmpeg on the backend, both of which are undesirable.

H.264 codec is fine man, it's used like everywhere! I think Safari is quite picky about WebM I think. I definitely agree though, don't use FFmpeg for this. You can also try using H.265 (in MP4) if you want a more modern, better codec. Just know that the codec strings are a bit weird.