Copyright © 2008 Kaltura Inc.
All Rights Reserved. Designated trademarks and brands are the property of their respective owners.
Use of this web site constitutes acceptance of the Terms of Use and Privacy Policy.
famfamfam
video won't play on all supported browsers
Sun, 07/18/2010 - 21:04
I'm posting a video on my class website and it will render properly in Opera 10.60, but not in Firefox 3.6.6 or Chromium 6.0.470.0 (52837). I'm running all these on Ubuntu 10.04.1 LTS, kernel 2.6.32-24-generic.
You can see the issue at http://www.bmoore.net/constitution_day.html.
Thanks for any help.
- Login or register to post comments
- 484 reads
-
- Printer-friendly version
Mon, 07/19/2010 - 12:04
#2
Thanks, Drew, but it did nothing in Chromium. Also, I'm not sure why I would need to specify that script, at all, if Chromium is supposed to natively accept the video element.
Mon, 07/19/2010 - 16:27
#3
Bryan,
It's working fine for me in Chromium 5 on Arch Linux.
Installing the Javascript will ensure that your video is playable on browsers that do not support the <video> element--On those rowsers, the video will be played by the Java Cortado plugin or a traditional flash player.
Merely supporting the <video> element is not enough for html5 video support. There are a number of different codecs that you must transcode your video into for it to work in all browsers.
See Mark Pilgrim's Dive Into HTML5 for an overview of current video codec support: http://diveintohtml5.org/video.html#video-codecs
Once you've transcoded your video into multiple formats, you can include each version of the file as a separate source. The following example shows a video in either Ogg Theora format (firefox, chromium, IE with the cortado plugin) or mpeg-4 (chromium, safari, flash fallback) as the multiple browsers require.
<video id="video" style="width:544px;height:304px;"
poster="media/Elephants_Dream.ogg.jpg"
duration="10:53" >
<source type="video/ogg" src="media/ed_1024.ogv" >
<source type="video/h264" src="media/ed_512kb.mp4" >
</video>
poster="media/Elephants_Dream.ogg.jpg"
duration="10:53" >
<source type="video/ogg" src="media/ed_1024.ogv" >
<source type="video/h264" src="media/ed_512kb.mp4" >
</video>
For more information consult http://www.kaltura.org/project/HTML5_Video_Media_JavaScript_Library
Let me know if the documentation for the HTML5 library is confusing and where, and I'll update those docs for clarity.
--Drew
Tue, 07/20/2010 - 13:48
#4
Strange... it *still* won't work for me and I've made all the changes you've suggested. I've changed the source to match your format and now it won't play at all. I've read through all the links... I *have* supported codecs, so that *can't* be the problem, right?
This is so irritating!
Tue, 07/20/2010 - 14:34
#5
I'm getting the video to load and play in Chromium and Opera, but not Firefox.
Check that the .ogv mime type is correctly installed on your webserver: See Troubleshooting:
http://www.kaltura.org/project/HTML5_Video_Media_JavaScript_Library
You can fix this problem for the Apache Web Server by adding the extension used by Theora video files (“.ogm”, “.ogv”, or “.ogg” are the common types) to the MIME type “video/ogg” via the “mime.types” file:
Edit the mime.types apache configuration file (in “/etc/apache” on linux, “\xampp\apache\conf\mime.types” on windows-xampp)
Search for `application/ogg ogg` (if not exist skip this step), delete this line
Add the following: `video/ogg ogg ogm ogv`
Restart apache
Or by adding the “AddType” configuration directive in httpd.conf -
AddType video/ogg .ogm
AddType video/ogg .ogv
AddType video/ogg .ogg
AddType video/ogg .ogv
AddType video/ogg .ogg
You'll know that the mime type has successfully been added when you can visit http://www.bmoore.net/constitution_day.ogv in Chromium and the video plays in the browser (currently it is being downloaded because the server isn't telling chromium that it's a stream that can be read by the application/ogv file handler, since the server doesn't know that the ogv is for streaming, it defaults to binary download).
I hope this helps.
--Drew
Tue, 07/20/2010 - 16:17
#6
I had the same problem initially, and adding the MIME types to the .htaccess file as papyromancer describes fixed it. While you're at it, you might want to go ahead and add the .mp4 and .webm file types as well:
AddType video/mp4 .mp4
AddType video/webm .webm
I've also added this line, just in case:
AddType application/ogg .ogg
HTML 5 vids now play from my site just as they're supposed to.
I see from your code that you've included an .mp4 version of your video. You need to modify your code to have it come FIRST:
<source type="video/h264" src="constitution_day.mp4">
<source type="video/ogg" src="constitution_day.ogv">
<source type="video/ogg" src="constitution_day.ogv">
Good luck!
Timm
Tue, 07/20/2010 - 17:41
#7
Put all that stuff in my .htaccess file and still nothing. Also, I see a picture of a fish as the movie is loading, even though I have a poster specified. Huh?
Also, timmdrumm, what would the order of the file declarations matter?
Tue, 07/20/2010 - 18:36
#8
Hey Bryan, sorry I missed it before, but you need an end quote for style="width:500px;height:400px;". That should get the poster working properly.
Perhaps there's something preventing your server from allowing .htaccess overrides, have you checked with the server admin? I've never tried adding in the mime types via .htaccess. It's definitely not working in this instance, I'm still getting the ogv as binary.
Tue, 07/20/2010 - 19:15
#9
Bryan,
You need to list the MP4 first in the source list due to an iPad bug that ignores anything but the first source element. That being said, when I initially deployed my test HTML5 video page, I couldn't get the thing to work in Safari (Windows version). After reading about the above mentioned quirk, I rearranged my code to place the .mp4 file first in the list. For whatever reason, Safari began to show the video.
@ papyromancer: I got things working by adding the MIME types via .htaccess as I mentioned above. I'm hosting that particular site with Network Solutions, and I haven't yet tried that with the other hosting companies my firm uses.
Tue, 07/20/2010 - 22:31
#10
@papyromancer: Thanks for the quote spot... I didn't even see that!
@timmdrumm: That makes sense. It's always the iPad causing problems, eh? :-)
For both of you/anyone who wanders in here: I've used .htaccess before, so I know it works on my hosting network, but now it doesn't seem to function. Are there any particular permissions I should give it?
Sun, 07/25/2010 - 12:12
#11
No one has any ideas?
Hey Bryan,
Looking at your page's source I don't see that you've installed the HTML5 Javascript library in your
<head>.Try adding this line in your head and see if it makes it better:
<script type="text/javascript" src="http://html5.kaltura.org/js" > </script>--Drew