[See the updates! - Works on Android/IOS browsers but no where else. FireFox, Chrome, Opera, Safari all fail. Even though they are definitely HTML5 video tag ready]
Simply trying to stream a video using html5 tag. All I get is the video player controls and nothing else. This is so simple I assumed it should just work:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Movie title</title>
</head>
<body>
<video id="movie" preload controls>
<source src="test.mp4" />
</video>
</body>
So where could I be going wrong? I've tried a lot more than this small snippet. I've tried other peoples example snippets. I've tried many videos, many formats (mp4, flv, ogg). I've tried viewing it in Chrome, Firefox, Android Embedded browser, Opera, IE9.
I can stream the file from the URL in programs like VLC without any issues.
I am beginning to think Apache2 might be the issue here although I figure the fact I can stream the URL from VLC without issue would suggest Apache2 is not the problem.
Any help appreciated. I'm pulling on hair here.
Update:
Whenever I try and access the URL of the video directory from within Chrome it seems to give me this error: Resource interpreted as Other but transferred with MIME type undefined
That error is definitely a server side problem, apache2 must not be configured properly somewhere?
If I access even a FLV file directory from the URL within my Apache2 server it gives this MIME type undefined error. It the video controls. Whenever I click play it spams the MIME type undefined a few times.
Update2:
Verified my .htaccess is being read
Added the following to my .htaccess:
AddType video/ogg .ogv
AddType video/ogg .ogg
AddType video/mp4 .mp4
Still not working, still see the MIME TYPE UNDEFINED in Chrome.
Update3:
Update4:
If your browser error "HTML5 video file not found", it means that your browser is not up to date or website pages does not have a suitable video codec. It would help if you communicated with the developer to solve the issue and install all the required codecs.
There are 3 things to check: make sure your video files are properly encoded for web delivery. make sure the server where the videos are hosted is properly configured for web delivery. make sure your others scripts on the page do not interfere with video playback.
wmv" video files are not supported by any browser. That is the only way for WMV video files.
Firefox and Opera don't support MP4, and Chrome will drop support for it soon. It's a good idea to also add a WebM source.
Try adding the type
attribute to the source
declaration:
<source src="test.mp4" type="video/mp4">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With