How obtain codec info of an HTML5 video from JavaScript?

Question

I want to know the video codec and, mainly, the audio codec used to encode an HTML5 video because, for example, Firefox supports MP4 video but, in its Windows version, if the audio is encoded with "sowt" the sound will not work. In this cases I can provide a WEBM source, but I have to know if there is a problem with the MP4 source first.

I found this but it is an IE11 property not implemented yet in other browsers.

What do you think? Is this possible?

Thank you in advance.

Sabir

FFmpeg or mp4box help you to get the video codec. This article help you to understand more medium.com/@JackPu/how-js-get-video-codec-548a33cf7454 – Pagas

Answer 1

Detailed low-level codec information is not provided through the media element. You can test if a browser can play a certain file using the canPlayType() method with the mime-type/codec as argument, but this is a general query which won't give specifics about a particular file, just the (potential) capability of the browser.

The audioTracks property you refer to (which also is supported in Safari) lists available audio tracks in a file that the browser already has decoded, ie. is able to read and handle. The track data is more "semantic" description type (type of track (main, translation, ..), language etc.), not anything about the coded used for the original data.

The only way to detect this low-level information is to load the video file (or part of it) using XMLHttpRequest (comes with CORS requirements) or a FileReader, as a byte buffer (ArrayBuffer) and manually parse it. Doable, but it provides for many pitfalls.

Generally, when the browser skips the first choice and uses secondary, third etc. choices, it means the browser cannot play that specific file which means it do have a problem with the file, but for this browser.

The best approach is to select codecs that works with most browsers in one or more combinations, and always make sure the video is rendered into one of those formats directly, or as a minimum converted into such a format.

Hypotonic

Thank you for the info. My problem is that sometimes my company doesn't encode the videos, the clients do it; we always can tell the client that they do it wrong, but it's easier choose another source like webm. I hoped that we could automatize the process. – Sabir

Answer 2

mp4box.js is JavaScript version of GPAC's MP4Box tool,
it can be used to obtain video infos including codec /duration/timescale and so on.
here is its github repo:
https://github.com/gpac/mp4box.js

Neophyte