HTML5 video mp4 and ogv problems in Safari and Firefox - but Chrome is all good

Question

I have the following code    lt video width  640  height  360  controls id  video-player  poster   movies poster png  gt    lt source src   movies 640x360 m4v  type  video mp4  codecs  avc1 42E01E  mp4a 40 2   gt    lt source src   movies 640x360 ogv  type  video ogg  codecs  theora  vorbis   gt    lt  video gt     I m using Rails  Mongrel in development and Mongrel Apache in production   Chrome  Mac and Win  can play either file  tested by one then the other source tags  whether locally or from my production servers  Safari  Mac and Win  can play the mp4 file fine locally but not from production  Firefox 3 6 won t play the video in either OS  I just get a grey cross in the middle of the video player area  I ve made sure that both Mongrel and Apache in each case have the right MIME types set  From Chrome s results I know there is nothing inherently wrong with my video files or the way the files are being asked for or delivered    For Firefox I looked at https   developer mozilla org En Using audio and video in Firefox where it refers to an  error  event and an  error  attribute  It seems the  error  event is thrown pretty well straightaway and at that time there is no error attribute  Does anyone know how to diagnose the problem

User · Answer

Incidentally   ogv files are video  so  video ogg    ogg files are Vorbis audio  so  audio ogg  and  oga files are general Ogg audio  so also  audio ogg   Checked in Firefox and work   application ogg  is deprecated for all audio or video uses  See http   www rfc-editor org rfc rfc5334 txt

User · Answer

Just need to change one letter     rename 640x360 ogv to 640x360 ogg   it will work for all the 3 browers

User · Answer

Add these lines in your  htaccess file and it will work for all browsers  Works for me   AddType video ogg  ogv AddType video mp4  mp4 AddType video webm  webm   If you dun have  htaccess file in your site then create new one    its obvious i guess

User · Answer

I see in the documentation page an example like this    lt source src  foo ogg  type  video ogg  codecs  amp quot dirac  speex amp quot   gt    Maybe you should enclose the codec information with  amp quot  entities instead of actual quotes and the type attribute with quotes instead of apostrophes   You can also try removing the codec info altogether

User · Answer

Just remove the inner quotes - they confuse Firefox  You can just use  video ogg  codecs theora vorbis    Also  that markup works in my Minefiled 3 7a5pre  so if your ogv file doesn t play  it may be a bogus file  How did you create it  You might want to register a bug with Firefox

User · Answer

The HTTP Content-Type for  ogg should be application ogg  video ogg for  ogv  and for  mp4 it should be video mp4  You can check using the Web Sniffer

[firefox] HTML5 video (mp4 and ogv) problems in Safari and Firefox - but Chrome is all good

Examples related to firefox

Examples related to video

Examples related to safari

Examples related to html

Examples related to ogg-theora