HTML5 - mp4 video does not play in IE9

Question

I have an mp4 video that I want to play in IE9 using HTML5  lt video gt  tag  I added the MIME type to IIS 7 so if I browse http   localhost video mp4 it plays in both Chrome and IE9 but not in HTML5  Chrome plays the video in HTML though   Here s the code    lt html gt   lt body gt     lt video src  video mp4  width  400  height  300  preload controls gt     lt  video gt   lt  body gt   lt  html gt    Any ideas   Thanks  UPDATE   Tried the same file in Firefox 5 0 and it didn t work either  only Chrome is able to play the mp4 video

User · Answer

If any of these answers above don t work  and you re on an apache server  adding the following to your  htaccess file     most of the common formats  add any that apply AddType video mp4  mp4  AddType audio mp4  m4a AddType video mp4  m4v AddType video ogg  ogv  AddType video ogg  ogg AddType video webm  webm   I had a similar problem and adding this solved all my playback issues

User · Answer

Internet Explorer and Edge do not support some MP4 formats that Chrome does  You can use ffprobe to see the exact MP4 format  In my case I have these two videos   Input  0  mov mp4 m4a 3gp 3g2 mj2  from  a mp4     Metadata      major brand       isom     minor version     512     compatible brands  isomiso2avc1mp41     encoder           Lavf56 40 101   Duration  00 00 12 10  start  0 000000  bitrate  287 kb s     Stream  0 0 und   Video  h264  High 4 4 4 Predictive   avc1   0x31637661   yuv444p  1000x1000  SAR 1 1 DAR 1 1   281 kb s  60 fps  60 tbr  15360 tbn  120 tbc  default      Metadata        handler name      VideoHandler   Input  0  mov mp4 m4a 3gp 3g2 mj2  from  b mp4     Metadata      major brand       isom     minor version     512     compatible brands  isomiso2avc1mp41     encoder           Lavf57 66 102   Duration  00 00 33 83  start  0 000000  bitrate  505 kb s     Stream  0 0 und   Video  h264  Constrained Baseline   avc1   0x31637661   yuv420p  1280x680  504 kb s  30 fps  30 tbr  15360 tbn  60 tbc  default      Metadata        handler name      VideoHandler   Both play fine in Chrome  but the first one fails in IE and Edge  The problem is that IE and Edge don t support yuv444  You can convert to a shittier colourspace like this   ffmpeg -i input mp4 -pix fmt yuv420p output mp4

User · Answer

Ended up using http   videojs com  to support all browsers   But to get the video working in IE9 and Chrome I just added html5 doc type and used mp4    lt  DOCTYPE html gt   lt html gt   lt body gt     lt video src  video mp4  width  400  height  300  preload controls gt     lt  video gt   lt  body gt   lt  html gt

User · Answer

If it s still not working here s what may certainly be a solution  encode the mp4 with compression format H 264  If you encode it with format mpeg4 or divx or else it will not work on IE9 and may as well crash Google Chrome  To do that  I use Any Video Converter freeware  But it could be done with any good video tool out there   I ve been trying all solutions listed here and tried other workaround for days but the problem lied in the way I created my mp4  IE9 does not decode other format than H 264   Hope this helps  Jimmy

User · Answer

Internet Explorer 9 support MPEG4 using H 264 codec  But it also required that the file can start to play as soon as it starts downloading   Here are the very basic steps on how to make a MPEG file that works in IE9  using avconv on Ubuntu   I spent many hours to figure that out  so I hope that it can help someone else    Convert the video to MPEG4 using H 264 codec  You don t need anything fancy  just let avconv do the job for you   avconv -i video mp4 -vcodec libx264 pre out mp4  This video will works on all browsers that support MPEG4  except IE9  To add support for IE9  you have to move the file info to the file header  so the browser can start playing it as soon as it starts to download it  THIS IS THE KEY FOR IE9     qt-faststart pre out mp4 out mp4    qt-faststart is a Quicktime utilities that also support H 264 ACC file format  It is part of libav-tools package

User · Answer

Dan has one of the best answers up there and I d suggest you use html5test com on your target browsers to see the video formats that are supported   As stated above  no single format works and what I use is MP4 encoded to H 264  WebM  and a flash fallback  This let s me show video on the following   Win 7 - IE9  Chrome  Firefox  Safari  Opera  Win XP - IE7  IE8  Chrome  Firefox  Safari  Opera  MacBook OS X - Chrome  Firefox  Safari  Opera  iPad 2  iPad 3   Linux - Android 2 3  Android 3   lt video width  980  height  540  controls gt           lt source src  images placeholdername mp4  type  video mp4    gt           lt source src  images placeholdername webm  type  video webm    gt           lt embed src  images placeholdername mp4  type  application x-shockwave-flash  width  980  height  570  allowscriptaccess  always  allowfullscreen  true  autoplay  false  gt  lt  embed gt    lt  --IE 8 - add 25-30 pixels to vid height to allow QT player controls-- gt           lt  video gt    Note  The  mp4 video should be coded in h264 basic profile  so that it plays on all mobile devices   Update  added autoplay  false  to the Flash fallback  This prevents the MP4 from starting to play right away when the page loads on IE8  it will start to play once the play button is pushed

User · Answer

From what I ve heard  video support is minimal at best  From http   diveintohtml5 ep io video html what-works   As of this writing  this is the landscape of HTML5 video   Mozilla Firefox  3 5 and later  supports Theora video and Vorbis audio in an Ogg container  Firefox 4 also supports WebM   Opera  10 5 and later  supports Theora video and Vorbis audio in an Ogg container  Opera 10 60 also supports WebM   Google Chrome  3 0 and later  supports Theora video and Vorbis audio in an Ogg container  Google Chrome 6 0 also supports WebM   Safari on Macs and Windows PCs  3 0 and later  will support anything that QuickTime supports  In theory  you could require your users to install third-party QuickTime plugins  In practice  few users are going to do that  So you   re left with the formats that QuickTime supports    out of the box     This is a long list  but it does not include WebM  Theora  Vorbis  or the Ogg container  However  QuickTime does ship with support for H 264 video  main profile  and AAC audio in an MP4 container   Mobile phones like Apple   s iPhone and Google Android phones support H 264 video  baseline profile  and AAC audio     low complexity    profile  in an MP4 container   Adobe Flash  9 0 60 184 and later  supports H 264 video  all profiles  and AAC audio  all profiles  in an MP4 container   Internet Explorer 9 supports all profiles of H 264 video and either AAC or MP3 audio in an MP4 container  It will also play WebM video if you install a third-party codec  which is not installed by default on any version of Windows  IE9 does not support other third-party codecs  unlike Safari  which will play anything QuickTime can play    Internet Explorer 8 has no HTML5 video support at all  but virtually all Internet Explorer users will have the Adobe Flash plugin  Later in this chapter  I   ll show you how you can use HTML5 video but gracefully fall back to Flash     As well  you should note this section just below on the same page   There is no single combination of containers and codecs that works in all HTML5 browsers  This is not likely to change in the near future  To make your video watchable across all of these devices and platforms  you   re going to need to encode your video more than once

User · Answer

Whithout JavaScript  the only way I could play without errors    lt  -- if lte IE 9  gt   lt  -- PUT HERE A FLASH PLAYER WITH video flv -- gt   lt   endif -- gt    lt  -- if gt IE 9  gt  lt  -- gt   lt video controls class  video  gt       lt source src  video mp4  type  video mp4  gt       lt  -- REPEAT FLASH PLAYER CODE HERE -- gt   lt  video gt   lt  -- lt   endif -- gt

User · Answer

I have a base profile  mp4 video which plays on one server  and does not on another   The only difference is  one gives a header  Content-Length       the other  Trasfer-Encoding  chunked    I found out that Content-Length is not needed  it is only important  that there should be NO chunked header  This can be done by turning off compression  deflate or gzip  for  mp4 files  How this can be done is another issue and another topic  How to disable Apache gzip compression for some media files in  htaccess file   There can be another server issue  it has to give  Content-Type  video mp4  and NOT  Content-Type  text plain

User · Answer

for IE9 I found that a meta tag was required to set the mode   lt meta http-equiv  X-UA-Compatible  content  IE Edge   gt    lt video width  400  height  300  preload controls gt   lt source src  movie mp4  type  video mp4    gt  Your browser does not support the video tag  lt  video gt

User · Answer

I had to install IIS Media Services 4 1 from the Windows Web App Gallery   http   www microsoft com web gallery install aspx appsxml http   www microsoft com web webpi 3 0 MediaProductList xml amp appid MediaServices

User · Answer

use both format it works fine in all browser    lt video width  640  height  360  controls gt       lt  -- MP4 must be first for iPad  -- gt       lt source src  unbelievable mp4  type  video mp4    gt  lt  -- Safari   iOS video    -- gt       lt source src  movie ogg  type  video ogg    gt  lt  -- Firefox   Opera   Chrome10 -- gt   lt  video gt

User · Answer

Try the following and see if it works    lt video width  400  height  300  preload controls gt     lt source src  video mp4  type  video mp4    gt    Your browser does not support the video tag   lt  video gt

[html] HTML5 - mp4 video does not play in IE9

Examples related to html

Examples related to internet-explorer-9

Examples related to html5-video