MP4 video will not play in Internet Explorer 11

Question

So I'm putting together a very video-heavy project with self-hosted videos in HTML5. I've got my videos encoded in both H.264/AAC MP4 and WebM formats, and they work beautifully in Chrome, Firefox, Safari, Mobile Safari etc. All good.

This is the most basic version of my code (in the production site I'm running it with VideoJS on top, however whether it's there or not, this problem occurs so I've removed the code for it from this example):

<video preload="true" width="720" height="406" controls="true">
    <source src="/55.mp4" type="video/mp4">
    <source src="/55.webm" type="video/webm">   
</video>

But Internet Explorer refuses to play ball. When I load up the page in IE 11, I just get a video decoding error:

In Internet Explorer's developer tools, I can see that it's getting a content type of video/mp4, and just to completely eliminate server issues I've tried it on both my local Apache install and my web hosting. If I use the console to get the playback error, I get MEDIA_ERR_DECODE : 3, which, according to the site I just linked to, means

An error has occurred in the decoding of the media resource, after the resource was established to be usable.

This tells me that there's a problem with the video encoding... but I can't see it.

The video files were originally exported as QuickTime videos from Adobe Premier or Final Cut Pro (I'm not sure which the video guy uses), and then run through Miro Video Converter to output MP4 and WebM formats. When I open the MP4 files up in VLC, it shows me the following information about the codecs in use:

I can't see anything wrong there; it looks exactly like every reference I've found online says MP4 video should be for maximum compatibility - H.264/AVC video and AAC audio.

Can anyone see anything wrong with what I'm doing? I'd love to be able to post an example video, however I can't due to privacy reasons. All the same any help would be greatly appreciated.

Bookrest

nobody answered. there is no answer to this question. this is one of the many incredible mysteries of internet explorer, even in its newest version... we will never know why. we can just have faith that one day, far away from now, this thing (and many others) will be magically gone. why? why you can play a video file in any other browser without any particular surprise and you cannot on IE11? why? – Squalor

Actually I do have an answer, had just forgotten about this post. Thanks for the reminder! – Bookrest

Answer 1

So this is somewhat embarrassing, but I did eventually figure it out.

The problem wasn't so much with Internet Explorer as it was the VM I was using to run Windows to test in Internet Explorer.

Essentially, I was running Windows 7 inside of a VirtualBox VM. When I (in desperation) sought out an actual physical machine running Windows... lo and behold it played!

I can only assume that the video drivers provided by VirtualBox didn't like decoding MP4 or something. The videos played fine in other browsers, but I'm guessing they decode/render video differently to how IE does.

Bookrest

Just for anyone else's sanity I had the same issue but it turned out not to be because I was running IE in VirtualBox. Another MP4 I dragged off the internet worked fine. In my cade I had to use Handbrake to re-encode the file by selecting the 'Windows Phone 8' preset. – Masker

Answer 2

I had the same issue recently with VirtualBox running Windows7 on MacOS. Solved by enabling 3D acceleration in the "Display" settings for the problematic VM.

Professionalism

Answer 3

The OP is a genius. I was struggling with this same issue for days and could only test on a windows machine today. This led me to change the configuration of my Parallels Desktop v15.

Im running IE 11 on Windows 8.1 and changed in the Graphics > Resolution > Advanced settings > Vertical synchronization should be ticked off.

Maybe this will help other people.

Largo

Answer 4

Maybe worth a shot: Rebooting Windows 7 within VMWare Fusion solved it for me.

Coggins