Comments (11)
Hello !
Thank you for the link to the samples :)
My message has been written in october 2020 and at this time there was almost no information at all. My project almost work now but thanks anyway :)
Actually, there is still a problem, I searched a lot but didn't find a way to demux webm files that use alpha channel as I reported here but got no help at all... Any idea ?
Also, there is no example at all showing how to do the opposite : mux the EncodedVideoChunk into a mp4 file.
I know how to do it using ffmpeg but I have no idea how to do it in pure javascript and there is no example at all.
I'm sorry to ask some help but most of webdevelopers (including myself) are not very familiar with mux / demux task .
Same thing for AudioEncoder / AudioDecoder : no example at all yet.
In my project, I'm forced to convert my mp3 into mp4 in order to use mp4box to demux my audio track. I'm sure it's doable using a mp3 demuxer but it's not easy to get into it from a classical webdeveloper point of view.
I also have no idea how to mux the EncodedAudioChunk into a mp3 file in pure javascript.
It's not as obvious as you may think it is (when I ask my question in october 2020 I didnt even know what could be a muxer / demuxer and I'm sure that 99% of webdevelopers never heard about that - now I know, but it was not obvious - )
from webcodecs.
Yes please ! Add a working example about it !
I'm trying to get it working for days and can't figure out how to save a canvas-animated-content as a mp4 file. I'm sure it's very simple, please show us a basic runnable demo.
from webcodecs.
We now have a few samples here
https://w3c.github.io/webcodecs/samples/
Including one that creates a webm file after using WebCodecs to encode the camera stream
https://w3c.github.io/webcodecs/samples/capture-to-file/capture-to-file.html
Closing, as I think the path to basic trim / concatenate functions is probably clear from the above. Roughly:
- if all you need is to concatenate two files, you don't need webcodecs at all. you can do that with a JS muxer like in the demo above.
- if you want to trim in the middle of a GOP and then concatenate, you may want to use WebCodecs to create a new GOP (starting with a new I-Frame) from the trimmed GOP. To do this, you would
- decode the original gop,
- discard (close()) the VideoFrames that are outside the trim window
- start encoding frames that are within the trim window
- add those encoded frames (chunks) at the concatenation boundary
- append the other (untrimmed) gops after that (no need to transcode).
Please reopen if more to discuss.
from webcodecs.
@tlecoz I totally agree with you!
from webcodecs.
@chcunningham Can you please provide an example showing how to do the opposite : mux the EncodedVideoChunk into a mp4 file. I'm stuck with this problem now.
from webcodecs.
from webcodecs.
You'll need to use something like https://github.com/videojs/mux.js or https://github.com/gpac/mp4box.js/ they both have code in their repositories showing how to generate an mp4 file. mux.js also offers a Slack channel for assistance: https://github.com/videojs/mux.js#talk-to-us
We'll try to put one together in the future, but it's not a priority at the moment.
from webcodecs.
from webcodecs.
These are the ones I saw:
https://github.com/videojs/mux.js/blob/main/test/mp4-generator.test.js
https://github.com/gpac/mp4box.js/blob/master/test/qunit-iso-creation.js
from webcodecs.
from webcodecs.
Hello !
I tryed to create a mp4 using mp4box. It almost work but there is a problem.
(i was in holidays, that's why I didn't try before)
from webcodecs.
Related Issues (20)
- Define scope for w3c candidate recommendation HOT 3
- Candidate Recommendation tracking issue
- VideoFrame copyTo() behavior with non-RGBA/RGBX/BGRA/BGRX formats HOT 1
- VideoPixelFormat enum values do not follow casing rule guidelines HOT 2
- EncodedAudioChunkInit should probably also support AllowSharedBufferSource HOT 1
- Issue
- numberOfChannels/sampleRate check in AudioDecoderConfig/AudioEncoderConfig HOT 1
- Under what conditions should the ImageDecoder [[completed promise]] and ImageTrackList [[ready promise]] be rejected? HOT 3
- Spec differentiates between ImageDecoder initialization with unsupported non-image MIME type and an unsupported image MIME type HOT 2
- how to config videoEncoder that output frame is annexB not avcC? HOT 1
- `ImageDecoder` is `[SecureContext]` but related interfaces aren't HOT 2
- `ImageBufferSource` should be `[AllowShared]` HOT 1
- Announcement: Background Segmentation metadata entry to WebCodecs VideoFrame Metadata Registry HOT 2
- Why is the audio encoder output timestamp different from the input timestamp
- Video encoder bitrate control in case frame rate is not provided
- Video frames on demand HOT 1
- Error code: SIGSEGV HOT 3
- VideoFrame.timestamp and EncodedVideoChunk.timestamp HOT 6
- video encoder memory leaks HOT 1
- Include some frame info with `VideoDecoder` Errors? HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from webcodecs.