We're just getting started with html5 video, and cannot seem to get .ogg files to play in Firefox, any tips? Here is the source we are using:
<video width="640" height="360" poster="http://video.thewebreel.com/episode_001/episode_001.jpg" controls autoplay autobuffer>
<source src="http://video.thewebreel.com/episode_001/episode_001.ogg" type="video/ogg" type='video/ogg; codecs="theora, vorbis"'/>
<source src="http://video.thewebreel.com/episode_001/episode_001.mp4" type="video/mp4" />
</video>
The live example can be seen here:
http://thewebreel.com/2010/05/02/episode-1.html
However we are totally baffled, everything seems exactly right.
I uploaded your .ogg to my server suspecting it was a server issue and it's working fine on my server
I'm guessing it's because your web server is replying with
Content-type: binary/octet-stream
Try adding the mime types to nginx...
Open up the Nginx mime type configuration file, eg: /etc/nginx/mime.types
Add these lines after the last video mime type
video/ogg ogm;
video/ogg ogv;
video/ogg ogg;
In one of the links mentioned, the correct way to play ogg files is..
<audio preload="auto" controls="controls">
<source src="media/song.ogg" type="application/ogg">
</audio>
Thanks to the person who pointed it out here.
HTML5 video (mp4 and ogv) problems in Safari and Firefox - but Chrome is all good
The correct mime types to set on your server are
AddType audio/ogg .oga (audio oga file)
AddType video/ogg .ogv (video ogv file)
AddType application/ogg .ogg (for audio and video)
Sources:
http://wiki.xiph.org/MIME_Types_and_File_Extensions
https://developer.mozilla.org/en-US/docs/Web/HTTP/Configuring_servers_for_Ogg_media
Ogg videos play were playing on Firefox 3.6 but not 4.0.
Here's the solution: video autobuffer controls preload="auto" instead of video controls preload="none"
This works in Firefox 3.6 and 4.0 and now MSIE 9!
Related
Sup guys.
Same issue here:
HTML5 video not playing in Firefox
except my background video is still not showing after I added
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
to my .htaccess file I created in the same folder as my videos
This is the page its supposed to play in:
http://wearerocketscience.com/wordpress/contact/
Please help :) TY
I saw this answer at Firefox won't play .webm and .ogv videos with HTML5
Taken from Fez Vrasta:
Seems I've found a solution:
I switched my ogv codec from VP8 to Tehora and now Firefox can play
video correctly.
I used this code for the source:
The MIMEtype is:
AddType video/ogg .ogv .ogg And the codec is:
Xiph.org's Theora Video (theo) I guess it could work also for .webm
but I've not tested it.
While the server seems to serve the correct mime types (webm and ogv play just fine when accessing directly) your <source> definitions are bogus:
<video id="video_background" preload="auto" autoplay="true" loop="loop" muted="muted" volume="0">
<source src="http://wearerocketscience.com/wordpress/wp-content/themes/twentytwelve/videos/contact.mp4"
type="video/mp4">
<source src="http://wearerocketscience.com/wordpress/wp-content/themes/twentytwelve/videos/contact.webm"
type="videos/webm">
<source src="http://wearerocketscience.com/wordpress/wp-content/themes/twentytwelve/videos/contact.ogv"
type="video/ogv">
</video>
It is video/webm (not videos) and video/ogg (not ogv).
HTML5 video wont play videos and I cannot play them directly from the server but they play in firefox and opera locally. I cant figure out what Im missing. Took this tag straight from w3c
<video width="500" height="300" controls>
<source src="video.ogv" type="video/ogg">
<source src="video.mp4" type="video/mp4">
<source src="video.webm" type="video/webm">
Your browser does not support the video tag.
</video>
ERROR is "No video with supported format and MIME type found"
EDIT: Error when accessing video directly in firefox is...
"Video playback aborted due to network error."
Add the following lines to your web-server's ".htaccess" file:
AddType video/mp4 mp4 m4v f4v f4p
AddType video/ogg ogv
AddType video/webm webm
AddType video/x-flv flv
This clears up supported format/MIME type issue.
I have a video and I want to display it on a webpage. I have saved it in several formats, an for IE i am using an MP4 file encoded with H.264.
I have tried both the video and the HTML code on my PC, and it works, but what I upload it to the server it doesnt (it says the media type is not compatible). I have tried accessing the video from the HTML page on my PC, and it gives the same error, so I think the error may be on the server sending an incorrect MIME TYPE (I have already specified "video/mp4" on the video tag).
Do you guys know how can I fix it?
<video controls autoplay poster="images/logobig.png" style="width:610px;">
<source src="videos/1.mp4" type="video/mp4" />
<source src="videos/1.ogg" type="video/ogg" />
<source src="videos/1.webm" type="video/webm" />
Your browser does not support HTML5
</video>
Finally I solved it, adding
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
to .htaccess
I prepared 3 video formats for my site:
/assets/video/background-purple.ogg
/assets/video/background-purple.webm
/assets/video/background-purple.mp4
on the site http://tekhy.net/
I use <video> tag for play the video:
<video webkit-playsinline autoplay="autoplay" loop="true" poster="/assets/video/transparent.png">
<source src="/assets/video/background-purple.ogg" type="video/ogg">
<source src="/assets/video/background-purple.mp4" type="video/mp4">
<source src="/assets/video/background-purple.webm" type="video/webm">
</video>
And I've setted the correct mimetype for my videos into .htaccess:
AddType video/mp4 .mp4 .m4v
AddType video/webm .webm
AddType video/ogg .ogv .ogg
In Google Chrome and Chromium all works well, on Firefox Mobile works well too. On Firefox Nightly 21.0a works well.
But on Firefox 18.0.1 on Elementary OS Luna it won't work.
Firebug tells me that it can't decode webm and ogg/ogv media (mp4 is not supported by Firefox atm).
I've tried also with background-purple.ogv type="video/ogv" but the problem remain.
My webm video is:
Google/On2's VP8 Video (VP80)
Planar 4:2:0 YUV
Currently I've really not idea on how solve this problem.
Any suggestion?
I believe this problem is related to a bug stemming all the way up to FF 20, where a lot of the popular webm encoders are inserting negative timestamps and firefox can't play the video until it downloads the whole webm file:
https://bugzilla.mozilla.org/show_bug.cgi?id=868797
The fix is mentioned in the comments:
ffmpeg -i input.webm -codec copy -avoid_negative_ts 1 output.webm
The important encoding flag being -avoid_negative_ts 1
Seems I've found a solution:
I switched my ogv codec from VP8 to Theora and now Firefox can play video correctly.
I used this code for the source:
<source src="/assets/video/background-purple.ogv" type="video/ogg">
The MIMEtype is:
AddType video/ogg .ogv .ogg
And the codec is:
Xiph.org's Theora Video (theo)
I guess it could work also for .webm but I've not tested it.
Chrome is a bit buggy with HTML5 video. Do as Fez suggested, or simply just use .mp4 and .webm. WEBM is more stable in Chrome and you only need these two formats for browser compatibility. This also saves you time rendering your videos!
I want to embed a video in the webpage, I use the following code:
<!-- Video Section-->
<video controls="controls" width="640px">
<source src="media/videos/video.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'/>
<source src="media/videos/video.webm" type='video/webm; codecs="vp8, vorbis"'/>
<source src="media/videos/video.ogv" type='application/ogg; codecs="theora, vorbis"'/>
</video>
So I can play this video on Safari, Chrome, but cannot on Firefox. I think Firefox support both ogg and webm video, so I don't know what's the problem. I only saw a gray block with a cross mark inside.
p.s. I used to use type='video/ogg', it didn't work, so I change to this type='application/ogg' based on googled suggestions, but this still doesn't work.
Thanks!
probably server settings. if you're on apache, check your mime.types file and see if or set these
AddType video/ogg .ogm
AddType video/ogg .ogv
AddType video/ogg .ogg