TL;DR:
Make sure your server (including Amazon CloudFront) is setting the correct mime type when returning the video file.For .mp4 files the mime type should be video/mp4
ISSUE:
I spent about an hour baffled why IE9 wouldn't play an H.264 video that Chrome and Firefox played fine.The only lead I had was this message output by Video.js using console.log:
Video Error[object Object]
What's more annoying is that IE9 doesn't let you inspect objects that are output by console.log. To get around that you can install the Firebug Lite bookmarklet. Unfortunately in this case the object doesn't give you much more to go on.
I tried swapping videos and found it worked with the sample Video.js video, which usually indicates a mime type issue (which seems to be a recurring issue with Microsoft products).
I was using Amazon CloudFront to server the videos (download style as opposed to streaming) and figured I couldn't set the mime type but it turns out you can:
- Go into S3 and find your video file.
- Right click and select Properties
- Select the Metadata tab
- In this case, set Key = Content-Type and Value = video/mp4
- Press Save button
