HTML5 Video not working on web server (all browsers) - html

I tested my video tags on localhost and it is working, after uploading it to a web server and check it, it is not working. I am 100% sure that I reference my videos correctly using a relative path. I also included the following on my .htaccess:
AddType video/ogg .ogv .ogg
AddType video/webm .webm
AddType video/mp4 .mp4
Here's my video tags:
<video autoplay poster="images/background-1.jpg" id="bgvid" loop>
<source src="vids/vid.mp4" type="video/mp4">
<source src="vids/vid.ogv" type="video/ogg">
</video>

Related

HTML5 background video still not playing of Firefox

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

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.

HTML5 Video not showing in Safari

I've read other answers on here regarding this issue but none help. I'm trying to use the HTML5 video in Safari, but it just won't show up at all. For reference view: http://www.shaun-pelling.com/malagnini/index2.html - (the video is found on the slider at the top, just click the slider arrow left once).
It shows up fine in all other browsers but Safari.
htaccess file:
<Files ~ "\.(mp4|m4v)">
AddType video/mp4 mp4
order allow,deny
allow from all
satisfy any
</Files>
AddType video/mp4 mp4 m4v
AddType audio/mp4 m4a
AddType video/ogg ogv
AddType audio/ogg ogg oga
AddType video/webm webm
HTML Code:
<video width="100%" controls="controls">
<source src="/malagnini/video/paradise.mp4" type="video/mp4" />
<source src="/malagnini/video/paradise.ogv" type="video/ogg" />
<source src="/malagnini/video/paradise.webm" type="video/webm" />
</video>
This is now solved. You need Quick Time installed to view HTML5 videos in Safari when on Windows.

Can't play HTML5 video

I am having trouble making an HTML5 video play. It wont play in any browser and in Firefox, it says "no video with supported format and MIME type found". I have read several places that say to change the htaccess file on the server which I have done by adding:
AddType video/ogg .ogm
AddType video/ogg .ogv
AddType video/ogg .ogg
AddType video/webm .webm
AddType audio/webm .weba
AddType video/mp4 .mp4
AddType video/x-m4v .m4v
at the top of the file, but the problem is still there...
Here is the HTML code:
<video controls="" width="944" height="416">
<source type="video/mp4" src="video/julebord2.mp4"></source>
<source type="video/webm" src="video/julebord2.webm"></source>
<source type="video/ogg" src="video/julebord2.ogv"></source>
<p>Your user agent does not support the HTML5 Video element.</p>
</video>
Does anyone know what the problem could be?

video js init error

I use the videojs as a html5 video player. but when the page was load, some errors like(firebug):
Video Error Object { originalEvent=Event error, type="error", timeStamp=
But the video is played normally after this, but I am afraid this will cause some unknown problems.
I use the videojs like:
<video id="my_video_1" class="video-js vjs-default-skin" preload="auto" width="640" height="480" data-setup="{}">
<source src="movie.mp4 " type='video/mp4'>
<source src="movie.ogv" type='video/ogg'>
</video>
Someone said that add this to htaccess file of /var/www/, or add them to apache httpd.conf file,
AddType video/ogg .ogv
AddType video/mp4 .mp4
AddType video/webm .webm
But it doesn't work yet.
What's the problem?