How do I get HTML5 h.264 Video working on Firefox?

For 12.04 / 14.04 / 18.10

Just visited the HTML5 Youtube test and I have H.264 checked; you probably will need to install Ubuntu restricted extras to get the gstreamer codecs.

sudo apt-get install ubuntu-restricted-extras

You may need to restart.

enter image description here


For 14.04

The solutions above are not working anymore with Trusty Tahr 14.04. The reason for this is the package gstreamer0.10-ffmpeg has been replaced by gstreamer1.0-libav but Firefox is planning to support gstreamer 1.0 only with version 30.

So in the meantime you can install the gstreamer0.10-ffmpeg from saucy for your appropriate architecture here :

  • https://launchpad.net/~mc3man/+archive/trusty-media

Firefox 33 and beyond

Mozilla added support for OpenH264 as a plugin in Firefox 33. To enable this plugin Firefox will now automatically download a binary from the OpenH264 website the first time you start the program.

That sounds great, doesn't it? Wait… that was a pun.

While this is indeed a very convenient solution it should also raise privacy and security concerns when software automatically downloads binaries from sites affiliated with Cisco Systems or other companies, no matter how transparent the process and license agreement is.

Not directly related but if you prefer to automatically delete cookies when Firefox gets closed and can't find the right cookie to keep for persistent HTML5 playback then I suggest to install YouTube ALL HTML5.

Tests with 14.04.2 and 15.04 VMs

My guess was that only installing an H.264 decoder binary wouldn't be enough, so I set up 2 new virtual machines:

  • Ubuntu 14.04.2 with restricted addons installed during installation
  • Ubuntu 15.04 without restricted addons installed during installation

After the installation of both VMs was completed I booted the systems, updated them again, installed VM guest additions, started Firefox for the first time and rebooted for the actual testing.

Since YouTube also offers their open sourced WebM formats and I wanted to avoid going into to much detail about test methods I needed to use another HTML5 capable site to test proprietary H.264 playback support. I chose Vimeo, because they say they default to HTML5 and they don't seem to support WebM, which I consider not to be a good thing.

Whenever I made some changes in the test, like installing a package or enabling/disabling something in Firefox I closed and launched Firefox again.

14.04.2 with restricted addons

enter image description here

As you can see in this screenshot only the OpenH264 plugin is enabled in Firefox, all the necessary GStreamer packages in different versions are preinstalled and the video plays as expected.

15.04 without restricted addons

enter image description here

As you can see in this screenshot the OpenH264 plugin is enabled, there is no Flash plugin, a few GStreamer packages in different versions are preinstalled but the video does not play! Instead the site immediately tells us that the video can't be played. Why is that?

enter image description here

  • AAC is missing! – To put an explanation simple, there is a file on the server that is fed into our browser. If you look for it using the inspector from the context menu in Firefox, you will find an MP4 with AAC-encoded audio. The error message could be more clear but it makes sense since we don't have a decoder for AAC currently installed.
  • Update: Looking again into this issue with Firefox 41, I found that OpenH264 seems to be disabled in about:config through:

    media.fragmented-mp4.exposed;false
    media.fragmented-mp4.gmp.enabled;false
    

    Setting these to true had no effect. Further settings I tried:

    • media.audio_data.enabled;true no effect.
    • media.mediasource.enabled;true Vimeo didn't use MSE before, enabling these and related settings had no effect.
    • media.fragmented-mp4.use-blank-decoder;true result: a solid green canvas and a constant sine wave audio signal.

15.04 with restricted addons

A smart approach would have been to install gstreamer1.0-plugins-bad-faad, but this doesn't make the particular error message on Vimeo go way, so let's install all the restricted addons.

enter image description here

As expected, everything works if you install the restricted addons package afterwards, but you may want to set the Flash plugin to something else than enabled in Firefox to be sure to use HTML5 video.

Analysis or just make it break

enter image description here

Apparently gstreamer1.0-libav is the only package you need to remove to get the error message back. So it was using libav's AAC decoder? I didn't dig deeper to find proof for that nor did I look for which decoder will be preferred (e.g. if OpenH264 is of any use currently on Linux) or if Vimeo throws this error message due to some other dependency not being met despite H.264 and AAC decoders being installed.

Summary and outlook

To sum it up, playback of current mainstream content does not only require an H.264 decoder but also an AAC decoder and H.265 is already preparing to replace the older one. Also I don't see the corresponding specification for MP4s with H.264 to be changed towards recommending a more open source friendly audio codec in the foreseeable future.

Seriously, push for WebM! You get VP8 + Vorbis as the H.264/AVC contender and VP9 + Opus as the H.265/HEVC contender.