X
Tap here to go to the mobile version of the site.

منتدى الدعم

On my new website I cannot get a webm to play

Posted

Hi all,

First off I'm using Firefox 44 currently and I've used a copy on my work PC that has well used user profile and also a fresh install on my home laptop without any additional addons with the same result.

I'm struggling to make html5 videos work across all browsers. I thought I had this nailed until I realised it had stopped working in Firefox. I'm currently using the following code to load video via a html5 webpage (I know this is html talk but please bear with me as I believe it more likely be a bug with firefox than my code):


EDIT: ok so it won't show my html 5 code properly and I can't find any instructions on how I should put html5 code into the questions on this support forum, so here it is in [tags], just replace the [] with <>

<!-- first try HTML5 playback: if serving as XML, expand `controls` to `controls="controls"` and autoplay likewise -->
<!-- warning: playback does not work on iOS3 if you include the poster attribute! fixed in iOS4.0 -->
<video width="900" height="506" poster="videos/poster.jpg" onclick="this.play()" preload="none" controls>
<source src="videos/playme.webmhd.webm" type="video/webm" /><!-- Chrome10+, Ffx4+, Opera10.6+ -->
<source src="videos/playme.mp4" type="video/mp4" /><!-- Safari / iOS, IE9 -->
<source src="videos/playme.oggtheora.ogv" type="video/ogg" /><!-- Firefox3.6+ / Opera 10.5+ -->						

<!-- fallback to Flash: -->
<object width="900" height="506" type="application/x-shockwave-flash" data="videos/player.swf">
<!-- Firefox uses the `data` attribute above, IE/Safari uses the param below -->
<param name="movie" value="videos/player.swf" />
<param name="allowFullScreen" value="true" />
<param name="allowScriptAccess" value="sameDomain" />
<param name="flashvars" value='autostart=true&amp;controlbar=over&amp;file=https://www.examplesite.com/videos/playme.mp4' />
<!-- fallback image -->
<img src="videos/No_Playback.jpg" width="900" height="506" alt="Oops No Playback"  title="Your browser cannot play this file, please use another browser" />
</object>
</video>

The page has several videos listed all with the same result. I don't believe its the code causing any issue either as even if I load the webm video directly in the url it still will not play. I've loaded the webm video in chrome without problem.

I can see from the network tab of the web console that it is trying to load the webm file and that the MIME type is correct, but it just displays the poster for the video and the correct length of the video. If I hit play it won't play, similarly if I try to seek it won't either. I've tried it with multiple videos too.

I did initially convert the videos from mp4 h264 into a webm using the webmhd preset in miro video converter. However I've also used the following command using ffmpeg to reconvert the video as suggested elsewhere online:

ffmpeg -i input.webm -codec copy -avoid_negative_ts 1 output.webm

As it is suggested that it could be a bug with negative timestamps in some version of firefox, but this still fails to load anything but the first video frame.

I've attached a screenshot of what I can see. The poster is a yellow jpg which states press play, so what you're actually seeing is the first frame of the webm video after I've hit play (as preload has been set to none).

I'm assuming it doesn't use the mp4 as a fallback because the webm should be working? I don't want to have to put the mp4 first as its larger in file size and not an open standard that will be permanently adopted. Plus the mp4s seem to take an age to load on android mobiles.

Now this code works fine in all other browsers, as does the webm files as stated above, except for either Firefox or Firefox Mobile on Android (can't test it on Mac as not an apple owner). I've tied it on various PCs and laptops (windows 7 & 10), and also my Sony xperia Z3. Currently using my windows 10 hp omen to type this.

ffmpeg video conversion output:

C:\ffmpeg\bin>ffmpeg -i input.webmhd.webm -codec copy -avoid_negative_ts 1 output.webm ffmpeg version N-79889-g9486de5 Copyright (c) 2000-2016 the FFmpeg developers

 built with gcc 5.3.0 (GCC)
 configuration: --enable-gpl --enable-version3 --disable-w32threads --enable-avisynth --enable-bzlib --enable-fontconfig --enable-frei0r --enable-gnutls --enable-iconv --enable-libass --enable-libbluray --enable-libbs2b --enable-libcaca --enable-libfreetype --enable-libgme --enable-libgsm --enable-libilbc --enable-libmodplug --enable-libmfx --enable-libmp3lame --enable-libopencore-amrnb --enable-libopencore-amrwb --enable-libopenjpeg --enable-libopus --enable-librtmp --enable-libschroedinger --enable-libsnappy --enable-libsoxr --enable-libspeex --enable-libtheora --enable-libtwolame --enable-libvidstab --enable-libvo-amrwbenc --enable-libvorbis --enable-libvpx --enable-libwavpack --enable-libwebp --enable-libx264 --enable-libx265 --enable-libxavs --enable-libxvid --enable-libzimg --enable-lzma --enable-decklink --enable-zlib
 libavutil      55. 24.100 / 55. 24.100
 libavcodec     57. 40.100 / 57. 40.100
 libavformat    57. 36.100 / 57. 36.100
 libavdevice    57.  0.101 / 57.  0.101
 libavfilter     6. 45.100 /  6. 45.100
 libswscale      4.  1.100 /  4.  1.100
 libswresample   2.  0.101 /  2.  0.101
 libpostproc    54.  0.100 / 54.  0.100

Input #0, matroska,webm, from 'input.webmhd.webm':

 Metadata:
   encoder         : Lavf54.3.100
   creation_time   : 1970-01-01 00:00:00
 Duration: 00:01:28.54, start: -0.002000, bitrate: 232 kb/s
   Stream #0:0(eng): Video: vp8, yuv420p, 1280x716, SAR 1:1 DAR 320:179, 15 fps, 15 tbr, 1k tbn (default)
   Stream #0:1(eng): Audio: vorbis, 44100 Hz, stereo, fltp (default)

[webm @ 000000000258e740] Using AVStream.codec to pass codec parameters to muxers is deprecated, use AVStream.codecpar instead.

   Last message repeated 1 times

Output #0, webm, to 'output.webm':

 Metadata:
   encoder         : Lavf57.36.100
   Stream #0:0(eng): Video: vp8, yuv420p, 1280x716 [SAR 1:1 DAR 320:179], q=2-31, 15 fps, 15 tbr, 1k tbn (default)
   Stream #0:1(eng): Audio: vorbis, 44100 Hz, stereo (default)

Stream mapping:

 Stream #0:0 -> #0:0 (copy)
 Stream #0:1 -> #0:1 (copy)

Press [q] to stop, [?] for help frame= 1328 fps=0.0 q=-1.0 Lsize= 2509kB time=00:01:28.52 bitrate= 232.1kbits/s speed=2.34e+003x video:1794kB audio:674kB subtitle:0kB other streams:0kB global headers:0kB muxing overhead: 1.643398%

I am happy to provide sample webm videos or any other necessary information you may require. Please let me know.

Any help would be greatly appreciated, thank you.

Hi all, First off I'm using Firefox 44 currently and I've used a copy on my work PC that has well used user profile and also a fresh install on my home laptop without any additional addons with the same result. I'm struggling to make html5 videos work across all browsers. I thought I had this nailed until I realised it had stopped working in Firefox. I'm currently using the following code to load video via a html5 webpage (I know this is html talk but please bear with me as I believe it more likely be a bug with firefox than my code): ------- EDIT: ok so it won't show my html 5 code properly and I can't find any instructions on how I should put html5 code into the questions on this support forum, so here it is in [tags], just replace the [] with <> <pre><nowiki><!-- first try HTML5 playback: if serving as XML, expand `controls` to `controls="controls"` and autoplay likewise --> <!-- warning: playback does not work on iOS3 if you include the poster attribute! fixed in iOS4.0 --> <video width="900" height="506" poster="videos/poster.jpg" onclick="this.play()" preload="none" controls> <source src="videos/playme.webmhd.webm" type="video/webm" /><!-- Chrome10+, Ffx4+, Opera10.6+ --> <source src="videos/playme.mp4" type="video/mp4" /><!-- Safari / iOS, IE9 --> <source src="videos/playme.oggtheora.ogv" type="video/ogg" /><!-- Firefox3.6+ / Opera 10.5+ --> <!-- fallback to Flash: --> <object width="900" height="506" type="application/x-shockwave-flash" data="videos/player.swf"> <!-- Firefox uses the `data` attribute above, IE/Safari uses the param below --> <param name="movie" value="videos/player.swf" /> <param name="allowFullScreen" value="true" /> <param name="allowScriptAccess" value="sameDomain" /> <param name="flashvars" value='autostart=true&amp;controlbar=over&amp;file=https://www.examplesite.com/videos/playme.mp4' /> <!-- fallback image --> <img src="videos/No_Playback.jpg" width="900" height="506" alt="Oops No Playback" title="Your browser cannot play this file, please use another browser" /> </object> </video></nowiki></pre> ---------- The page has several videos listed all with the same result. I don't believe its the code causing any issue either as even if I load the webm video directly in the url it still will not play. I've loaded the webm video in chrome without problem. I can see from the network tab of the web console that it is trying to load the webm file and that the MIME type is correct, but it just displays the poster for the video and the correct length of the video. If I hit play it won't play, similarly if I try to seek it won't either. I've tried it with multiple videos too. I did initially convert the videos from mp4 h264 into a webm using the webmhd preset in miro video converter. However I've also used the following command using ffmpeg to reconvert the video as suggested elsewhere online: ffmpeg -i input.webm -codec copy -avoid_negative_ts 1 output.webm As it is suggested that it could be a bug with negative timestamps in some version of firefox, but this still fails to load anything but the first video frame. I've attached a screenshot of what I can see. The poster is a yellow jpg which states press play, so what you're actually seeing is the first frame of the webm video after I've hit play (as preload has been set to none). I'm assuming it doesn't use the mp4 as a fallback because the webm should be working? I don't want to have to put the mp4 first as its larger in file size and not an open standard that will be permanently adopted. Plus the mp4s seem to take an age to load on android mobiles. Now this code works fine in all other browsers, as does the webm files as stated above, except for either Firefox or Firefox Mobile on Android (can't test it on Mac as not an apple owner). I've tied it on various PCs and laptops (windows 7 & 10), and also my Sony xperia Z3. Currently using my windows 10 hp omen to type this. ffmpeg video conversion output: C:\ffmpeg\bin>ffmpeg -i input.webmhd.webm -codec copy -avoid_negative_ts 1 output.webm ffmpeg version N-79889-g9486de5 Copyright (c) 2000-2016 the FFmpeg developers built with gcc 5.3.0 (GCC) configuration: --enable-gpl --enable-version3 --disable-w32threads --enable-avisynth --enable-bzlib --enable-fontconfig --enable-frei0r --enable-gnutls --enable-iconv --enable-libass --enable-libbluray --enable-libbs2b --enable-libcaca --enable-libfreetype --enable-libgme --enable-libgsm --enable-libilbc --enable-libmodplug --enable-libmfx --enable-libmp3lame --enable-libopencore-amrnb --enable-libopencore-amrwb --enable-libopenjpeg --enable-libopus --enable-librtmp --enable-libschroedinger --enable-libsnappy --enable-libsoxr --enable-libspeex --enable-libtheora --enable-libtwolame --enable-libvidstab --enable-libvo-amrwbenc --enable-libvorbis --enable-libvpx --enable-libwavpack --enable-libwebp --enable-libx264 --enable-libx265 --enable-libxavs --enable-libxvid --enable-libzimg --enable-lzma --enable-decklink --enable-zlib libavutil 55. 24.100 / 55. 24.100 libavcodec 57. 40.100 / 57. 40.100 libavformat 57. 36.100 / 57. 36.100 libavdevice 57. 0.101 / 57. 0.101 libavfilter 6. 45.100 / 6. 45.100 libswscale 4. 1.100 / 4. 1.100 libswresample 2. 0.101 / 2. 0.101 libpostproc 54. 0.100 / 54. 0.100 Input #0, matroska,webm, from 'input.webmhd.webm': Metadata: encoder : Lavf54.3.100 creation_time : 1970-01-01 00:00:00 Duration: 00:01:28.54, start: -0.002000, bitrate: 232 kb/s Stream #0:0(eng): Video: vp8, yuv420p, 1280x716, SAR 1:1 DAR 320:179, 15 fps, 15 tbr, 1k tbn (default) Stream #0:1(eng): Audio: vorbis, 44100 Hz, stereo, fltp (default) [webm @ 000000000258e740] Using AVStream.codec to pass codec parameters to muxers is deprecated, use AVStream.codecpar instead. Last message repeated 1 times Output #0, webm, to 'output.webm': Metadata: encoder : Lavf57.36.100 Stream #0:0(eng): Video: vp8, yuv420p, 1280x716 [SAR 1:1 DAR 320:179], q=2-31, 15 fps, 15 tbr, 1k tbn (default) Stream #0:1(eng): Audio: vorbis, 44100 Hz, stereo (default) Stream mapping: Stream #0:0 -> #0:0 (copy) Stream #0:1 -> #0:1 (copy) Press [q] to stop, [?] for help frame= 1328 fps=0.0 q=-1.0 Lsize= 2509kB time=00:01:28.52 bitrate= 232.1kbits/s speed=2.34e+003x video:1794kB audio:674kB subtitle:0kB other streams:0kB global headers:0kB muxing overhead: 1.643398% I am happy to provide sample webm videos or any other necessary information you may require. Please let me know. Any help would be greatly appreciated, thank you.
Attached screenshots

Modified by cor-el

Additional System Details

Installed Plug-ins

clean install

Application

  • User Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/50.0.2661.94 Safari/537.36

More Information

jscher2000
  • Top 10 Contributor
8688 solutions 71030 answers

I doubt I can help with this, as you lost me at negative time stamps. However, two questions:

(1) Will the video play if you open it stand-alone in a tab (paste the direct address and press Enter)?

(2) Any difference in the current release, Firefox 46.0.1? Just in case it's a fixed bug.

I doubt I can help with this, as you lost me at negative time stamps. However, two questions: (1) Will the video play if you open it stand-alone in a tab (paste the direct address and press Enter)? (2) Any difference in the current release, Firefox 46.0.1? Just in case it's a fixed bug.

Question owner

jscher2000 said

I doubt I can help with this, as you lost me at negative time stamps. However, two questions: (1) Will the video play if you open it stand-alone in a tab (paste the direct address and press Enter)? (2) Any difference in the current release, Firefox 46.0.1? Just in case it's a fixed bug.

Hi Jscher, thanks for the reply... I was a little lost at negative timestamps too, that was just a similar issue i tried the solution for. In answer to your questions:

1. no video won't load directly. Sorry I did state this in the above, but I did type a lot! As you can see I've spent some time researching this issue.

2. sorry just realised my work pc (windows 7) was firefox 44. this laptop was version 45.0.2 and i've now updated to the latest 46 with the same result. its also the same on firefox mobile.

Actually, not quite the same. If I click to seek a few seconds into the webm video I reconverted using the ffmpeg it now plays, but the play / pause controls do not. The videos not reconverted with ffmpeg still don't work in anyway.

''jscher2000 [[#answer-875157|said]]'' <blockquote> I doubt I can help with this, as you lost me at negative time stamps. However, two questions: (1) Will the video play if you open it stand-alone in a tab (paste the direct address and press Enter)? (2) Any difference in the current release, Firefox 46.0.1? Just in case it's a fixed bug. </blockquote> Hi Jscher, thanks for the reply... I was a little lost at negative timestamps too, that was just a similar issue i tried the solution for. In answer to your questions: 1. no video won't load directly. Sorry I did state this in the above, but I did type a lot! As you can see I've spent some time researching this issue. 2. sorry just realised my work pc (windows 7) was firefox 44. this laptop was version 45.0.2 and i've now updated to the latest 46 with the same result. its also the same on firefox mobile. Actually, not quite the same. If I click to seek a few seconds into the webm video I reconverted using the ffmpeg it now plays, but the play / pause controls do not. The videos not reconverted with ffmpeg still don't work in anyway.
jscher2000
  • Top 10 Contributor
8688 solutions 71030 answers

Occasionally there are different error messages in the Browser Console (Ctrl+Shift+j on Windows).

If that doesn't shed any more light, maybe it would make sense to file a bug and provide a link to one of the videos to see whether someone closer to the decoding logic can spot the issue.

https://bugzilla.mozilla.org/enter_bug.cgi

Occasionally there are different error messages in the Browser Console (Ctrl+Shift+j on Windows). If that doesn't shed any more light, maybe it would make sense to file a bug and provide a link to one of the videos to see whether someone closer to the decoding logic can spot the issue. https://bugzilla.mozilla.org/enter_bug.cgi