Video not working in Firefox (locally and on server)
Edit: Now everything is working. I still got the old version though.
http://www.creativeblends.tv
I am using Firefox 7.0.1.
[s]I just made this test page: www.creativeblends.tv/test-iframe[/s] and it works with webm on Chrome, with mp4 on Safari, but it does not work with ogv on Firefox, it just stays with the loader for ever, both: locally and on my server. I tried to add a video src="/assets/video/video.ogv" controls></video and it doesn't play either. The player seems to work fine then... I think. But what did I miss?
I got my .htaccess file:
AddType video/ogg .ogv
AddType audio/ogg .ogg
AddType video/mp4 .mp4
AddType video/webm .webm
AddType text/plain .srt
and I converted the ogv file with ffmpeg2theora (so it actually shouldn't be the compressor or anything either).
Anyone has a hint?
2 Posted by fingernageldreck on 16 Nov, 2011 01:39 AM
Edit: I just analized the ogv file from the VideoJS website and the only difference to the one I have is that mine is converted with ffmpeg2theora v.1.2.0alpha (Ptalarbvorm) instead of v.1.1. Does this affect something?
Edit: It shouldn't. Just tried with the original dolphin and whale video from VideoJS and I have the same problem, locally and on my server. Firefox won't work.
3 Posted by fingernageldreck on 16 Nov, 2011 01:57 AM
The ogv file can play in firefox when I open the file directly in the browser. so it shouldn't be a problem of the conversion neither... damn. What else can it be?
Edit:
Still trying to figure that out...
As I wrote before, the ogv file is playing when I open in Firefox the entire path of the video (I think it is the same when dropping the file on the browser.) BUT IT DOES NOT PLAY locally when opening the entire webpage with the VideoJS player, nor in a video tag. Strange, very strange... I downloaded the original ogv file from the website of VideoJS (dolphins and whales) and it can`t play locally either. Till now, definitely, it is not a MIME Type error...
could there be other code that is interfering?
Edit: It seems that it isn't a code which is interfering. I just tried with a new html document in dreamweaver and just pasted a video tag:
[video width="320" height="240" controls="controls"> Your browser does not support the video tag. </video]
(replacing [ and ] with > and <)
and... IT DOESN'T WORK EITHER!!!
Is this a Firefox 7.0.1 problem? Weird that I am the only one having this issue...
4 Posted by Karin Grech on 16 Nov, 2011 11:21 AM
I have the same problems, I am using both the plugin short code and the Video Embed Builder code, the videos will not play in Firefox and IE 7 (that's the only one I am testing on).nI am only using mp4 files though and fallback for Flash.
So far I have found no solution for this problem either.
5 Posted by fingernageldreck on 16 Nov, 2011 02:36 PM
The mp4 Format nor the fallback for Flash do work in Firefox. Ogv is the only format Firefox does recognize. (I found this information somewhere in http://camendesign.com/code/video_for_everybody). This is the code where videoJS is build from. So you definitely should add an ogv video.
And common people. Common staff. No ideas to my problem?
6 Posted by fingernageldreck on 16 Nov, 2011 03:07 PM
I just updated to Firefox 8.0 and the same problem persists. OGV is not playing and just spinning as it wouldn't find the video file at all.
7 Posted by fingernageldreck on 17 Nov, 2011 01:32 AM
I just found out, that Firefox isn't actually playing the ogv file, but the webm video. At least on the videojs homepage. (right click on the file --> download).
Still, the problem consists, but the problem is the webm file. I downloaded the oceans-clip.webm and tried with the same code from the demo.html. Just changed the direction of the video.js and the video-js.css to my own folders and directed the videos to my video folder. I am doing this all locally, so the MIME shouldn't be any problem, right? When I add only the oceans-clip.ogv, Firefox still works properly as it is still playing the webm file. But when I add the oceans-clip.webm, Firefox just spins and spins.
Any ideas? Please?
8 Posted by fingernageldreck on 17 Nov, 2011 01:45 AM
Hahaha... this is making me crazy. I just tried to invert the order of the videos. First mp4, then ogv and then webm. Firefox now is working but it plays the webm, the one I thought would be problematic (see comment above). Chrome plays mp4 and Safari plays mp4. For what do I need the ogv for?
I even can delete the ogv file code and Firefox is still working great with webm.
I think, that the ogv file is for older versions, am I right? So,... how do I make all three of them work?
9 Posted by fingernageldreck on 17 Nov, 2011 02:10 AM
I just found this page where you can see which browser is going to use which video format. http://camendesign.com/code/video_for_everybody/test.html .
The ogv is used by older browsers, it makes sense to include first the webm and then the ogv video. But why is it actually? And why does it work when I change the order?
10 Posted by Styves Goupil on 29 Nov, 2011 02:51 PM
Hi fingernageldreck, did you solved the problem with WebM and Firefox? I have a similar issue here where my ogv file won't play in firefox, nor the mp4 (normal for this one), and I read somewhere to put the mp4 first in the list else it won't play on iOS 3.x devices... Anyways, I tough I didnt need the WebM because I read that only Chrome would need that format (Google and h.264 codec are not good friends, the want to try to set WebM as the next standard because it's open, something like that), so Chrome would not support mp4 in the future version maybe. But Chrome does support ogv file as long as I know, so I though I only needed MP4 and OGV. Now if Firefox plays the WebM and not OGV (even if it says it should work) I will go for WebM, but you seem to have a problem on your side with your WebM video... so... did you find a solution for firefox and webM?
11 Posted by fingernageldreck on 29 Nov, 2011 03:14 PM
I got a test page working, but sincerly I don't know what I did. It just worked. Probably it has to do with the spaces... although I think this can't be possible.
Try to copy the exact code from the demo html http://videojs.com/video-js/demo.html (right click and show source code). and copy it like that in your web page. then just change your own path to the js and css files, as well as the video paths.
12 Posted by Hiroyoshi T on 08 Dec, 2011 07:18 PM
Change the file extension from .ogv to .ogg worked magically for me.
13 Posted by GR on 13 Dec, 2011 09:06 PM
Try this sequence...mp4 , ogg then webm followed by flash...It worked for me finally!!!!
14 Posted by mikeeee on 05 Jan, 2012 06:53 PM
Changing the extension to .ogg worked for me as well. This job is the worst sometimes.
15 Posted by Chris on 14 Jan, 2012 01:34 AM
Using the wordpress plugin, still doesn't work for me even using ogg, changing the order...what's weird is that it works with the file from the demo. It's got to be from the file I'm using but I'm using Wondershare video converter to convert my video to webm, why it doesn't work?
Support Staff 16 Posted by Steve Heffernan on 14 Jan, 2012 02:14 AM
Just pushed the 3.0 version of the Wordpress plugin. Mind trying that?
http://wordpress.org/extend/plugins/videojs-html5-video-player-for-wordpress/
---
Steve Heffernan (mobile)
17 Posted by Ian on 19 Jan, 2012 07:00 PM
Hi, I was having the same issue in firefox 9. Did as suggested above and changed the extension from ogv to ogg both in the code and for the video file and it works now. Apparently it's a firefox issue. I then tested in IE 7,8, and 9 and chrome and it plays beautifully. In case anyone is having the IE crash issue for flash fallback, use absolute url instead of relative paths to fix that. I just need to test in safari to make sure most people are covered but I assume it probably works fine.
18 Posted by ian_dunn on 26 Jan, 2012 06:08 PM
I'm using version 3.0 of the WordPress plugin and it didn't work in FireFox 9.0.1 until I changed the order of the sources in the video tag like fingernageldreck said in comment #8.
I also modified the plugin so that it used locally hosted VideoJS files, because the site requires HTTPS, so that may have been a factor.
Support Staff 19 Posted by Steve Heffernan on 27 Jan, 2012 01:04 AM
Very cool @ian_dunn. The source code for the plugin is on github if you want to try adding the option for a local version.
https://github.com/zencoder/video-js-for-wordpress
20 Posted by Dan on 22 Feb, 2012 05:32 PM
I have video-js for a normal site using only the mp4 and flash backup and it's working fine in all newer browsers; however, when I try to bring this into wordpress it breaks. everything is apparently working and it goes to play the video in firefox but just a black screen. Is there anything inside wordpress that would prevent the flash from playing? I'm getting the black screen so it's loading the flash but just not playing for some reason.
because of space limits (and a lot of videos) they only want to make mp4s for the videos otherwise the webm works just fine :)
using wordpress 3.3.1 and the latest download of video-js...at first I thought it was because i'm not using the plugin they made but it's doing the same thing
21 Posted by Erick Arbe on 02 Mar, 2012 02:45 AM
Hey guys, I was having this same problem. I fixed all my HTML5 videos by using the .htaccess file from the HTML5 Boilerplate: http://html5boilerplate.com/
22 Posted by zwoollett on 08 Mar, 2012 08:17 PM
Pulling my hair out over this one as well - happy in most every browser except Mozilla as well. I've followed everything up above here and can even run the video locally. Is there any reason why the video won't play when it's uploaded to my provider??
Attempt :1: run code locally pointing to local webm file - No issues
Attempt 2: run code locally pointing to video file hosted elsewhere - just spins
Attempt 3: run uploaded code pointing to video file hosted elsewhere - just spins
Here's a link to my test page (http://www.dctc-creative.com/video/test2.html) - what have I missed? (The first video on the page is just to confirm that the video from videojs works on my Mozilla browser
Here's the stupid part - I grabbed the "ocean's clip" video and uploaded it to my server and it works fine. (seriously??)
So - my converted video plays fine in Mozilla locally, but not on my server
The "oceans-clip" video plays fine in both places.
The temptation is to say it's something with my conversion process, but why would it play locally but not from the server?
Thanks for listening...
23 Posted by fingernageldreck on 08 Mar, 2012 08:37 PM
I opened your link and both videos are not working (firefox latest build). Also, it loads only a flash player, not the video-js player. I think it has to do with either the htaccess or you simply did not upload the scripts to your server. Did you check both? And if you have the script uploaded, did you check the htaccess directly from a browser (open it from your ftp host server (and not from your computer) and check that the file is not corrupted).
www.creativeblends.tv
24 Posted by zwoollett on 08 Mar, 2012 09:03 PM
Thanks for quick response!
I was running Firefox 9, so I just upgraded to the latest build so we could be on the same page.
As you already know, both videos no longer work when run on my server. I put the old ocean video back up (linking directly to the videojs file) and it works fine.
I guess I've got some more reading to do - the videos all worked fine in every browser except Firefox, so I didn't think there was anything to it. I just followed the "5 second setup" - sounds like Firefox is requiring a bit more...
I'll keep reading over there and see what else needs to be done - it just didn't look that hard!
-Zeke
25 Posted by zwoollett on 08 Mar, 2012 09:19 PM
My apologies, and I appreciate your patience. I spent 7 years as a Vignette developer, but am trying to get my skillset current with something that's actually in use!
http://www.dctc-creative.com/video/Hyundai_Classroom_60_VP8_001.html
This plays fine locally, but obviously not here on the server. This particular site is hosted by Network Solutions - is there anything else that I need to do other than simply paste this code into my html page? (And yes, you can pretend you're talking to a 5 year old :)
<video controls="controls" autoplay="autoplay">
<source src="Hyundai_Classroom_60_VP8_001.webm" type="video/webm" />
</video>
(I realize that I need other video formats to play in other browsers-it's only Mozilla that's the problem) What is it about Mozilla that makes this suddenly become so difficult??
(And yes, I found your simple htaccess file from December 13 and uploaded to the root directory - didn't make a bit of difference, so I'm guessing I missed something...)
Thanks for your help and I promise to stop bugging you after this!
-Zeke
26 Posted by lileybilly on 08 Mar, 2012 10:16 PM
I have the same issue with Firefox as well. Tried all of the above and didn't help. I just uploaded the files to 4 different servers and all failed except our streaming server. Ogv played beautifully on Firefox! I am wondering if this has something to do with MINE type...
27 Posted by webmaster on 08 Mar, 2012 10:22 PM
28 Posted by zwoollett on 09 Mar, 2012 05:53 AM
OK - so the problem was mine. I was attempting to run this on a Windows box which was causing my issues (I realize this is probably common knowledge to everyone but me!). After switching over to a UNIX box, all the problems went away. Thanks for your help and patience!
// Add your reply above here
==================================================
From: webmaster
Subject: Video not working in Firefox (locally and on server)
<html><body><span style="font-family:Verdana; color:#000000; font-size:10pt;"><div> #ignore<br><br></div> <blockquote id="replyBlockquote" webmail="1" style="border-left: 2px solid blue; margin-left: 8px; padding-left: 8px; font-size:10pt; color:black; font-family:verdana;"> <div id="wmQuoteWrapper">
29 Posted by Ian on 12 Mar, 2012 05:47 PM
zwoolet,
I wouldn't call it common knowlege. I was not aware until you posted your issue and I started googling for webm and IIS. IIS does not support webm and other open format MIME types. It should return an error but in my firefox 9 if I go directly to the link for your video file it downloads the file and then opens it locally. So yeah, IIS is the problem. Thanks for pointing that out so we'll all know if we ever use a IIS server.
This link tells how to fix the issue with web.config but looks like part of the example line is missing. http://madskristensen.net/post/Prepare-webconfig-for-HTML5-and-CSS3... . It's a starting point anyway.
30 Posted by Jared on 22 Mar, 2012 03:22 AM
Its not pretty, but I got mine working by removing the Ogg, WebM encodings (leaving just MP4) - and forcing Firefox and IE to resort to flash. FF11, VJS 3.01.
31 Posted by krishna on 27 Mar, 2012 03:41 PM
I added an mp4 video to dream weaver. I can see the video being played perfectly well locally but when I wish the same changes in my server, I am not able to do so. Please someone help me