I have an mp4 video in my site. If I run it in localhost using Safari it works. But if I check it in production (Safari) is not working. The same if I go to the full path of the video.
This is my code:
<video loop="loop" muted="muted" poster="/videos/dashboards_poster.png" autoplay="autoplay" src="videos/dashboards.mp4"></video>
Also, if I go to: https://example.com/videos/dashboards.mp4 is not working and in the console I'm seeing:
Failed to load resource: Plug-in handled load
But if go to: http://localhost:9000/videos/dashboards.mp4 is working!
This is only happening in Safari. Chrome and Firefox works fine. My Safari version is: 9.1 (11601.5.17.1)
Any ideas?
Thanks!
Related
I am encoding camera stream to ogg an showing it on HTML5 app.
On Windows:-
chrome - showing green screen sometimes and sometimes streams shows up.
Mozilla - working fine
On android
chrome - not working
Mozilla - Working fine
WebView- not working, a big play button appears
HTML code-
<video autoplay loop ><source type="video/ogg" src="streampath/name.ogg">
</video>
Vlc streaming code
cvlc -vvv rtsp://cameraInputStream --sout '#transcode{vcodec=theo, vb=800, channels=1, ab=128, samplerate=44100, width=320}:http{dst=:8090/output.ogg}'
Why it is not working on android chrome browser ,android webview and green screen on windows chrome.
I have an HTML page that contains a MP4 video:
<html>
<body>
<video width="800" height="600" controls>
<source src="/static/xyz.mp4" type="video/mp4">
<p>Your browser does not support the video tag.</p>
</video>
</body>
</html>
When I load the page in Firefox, it doesn't show the play control buttons but shows error message "No video with supported format and MIME type found" (see the screenshot below).
So I use this site to test my browser's ability to play HTML5 mp4 video and it can successfully play the test video on that site. My Firefox version is v36 on CentOS Linux. I also tried using Chrome and it can't play it either. I also tried it on Firefox/Chrome on Windows but failed. I then use the Firefox debugger to look at the debug info and I see the following message:
Media resource http://localhost:5000/static/xyz.mp4 could not be decoded.
All candidate resources failed to load. Media load paused.
I then tried playing the xyz.mp4 video on my local machine using Linux's movie player and it plays fine and it also plays fine in Window's media player. But when I use the above HTML5 <video> tag, it doesn't play for all browsers in both Linux and Windows. I also followed Mozilla's online forum to change the browser settings and clear caches but none of them works. So what caused the problem of this simple HTML5 ?
This is very likely the problem with your video file. mp4 is not really a format, but a container that can hold video in different formats. Firefox supports only H.264 encoded video.
Simply speaking, there are several types of mp4 files and not all of them are supported by browser. To verify this, you can download one of the videos from the quicksmode website and replace your video with it.
Possible solution:
//autoplay muted onloadedmetadata="this.muted = true"
<video id="abc" autoplay muted onloadedmetadata="this.muted = true" >
<source src="https://github.com/mediaelement/mediaelement-files/blob/master/big_buck_bunny.mp4?raw=true" type="video/mp4">
Your browser does not support the video tag.
</video>
I am using Html5 audio tag in my site and referring only mp3 audio format(not ogg), its working fine in firefox browser from a test server but when same code deployed on live site then its not playing the audio in firefox browser.
<audio controls>
<source src="planetarian.mp3" type="audio/mpeg">
Your browser does not support the audio element.
</audio>
Please help me to find out the root why same code is play from a server but on live its not working.
Firefox 21+ started to support the MP3 files, please check your mime type on server whether MP3 is added there or not.
I got same problem.once I make it mp3 file as 64kbps bit rate,It's working for me.please check your audio bit rate.
I want to play an HTML5 video (MP4, quickstart) in IE 11 using the autoplay option.
All browsers are working fine (Firefox, Chrome, mobile Android and iOS): they start playing the video immediately while downloading in background.
Only IE does not start playing before it completely downloaded the file. After downloading the file (I can see this in the apache log) the video starts playing - so the autoplay option is recognized in some way.
The code is really easy and only basic html5 video markup
<video id="myVideoPlayer" height="260" class="hidden-print" style="display:inline-block; float:left;" preload="auto" autoplay="autoplay" controls="controls" loop="loop">
<source src="/stream.php?id=1234&quality=hd" type="video/mp4"></source>
<source src="/stream.php?id=1234&quality=webm-hd" type="video/webm"></source>
</video>
If I directly call the stream.php I have the same issue - but again only in IE.
I can then see in my server logs:
one complete download of the video during page load
then some kind of embedded quicktime player is shown on the IE page. The player starts a new download ans starts playing the video while downloading.
and I then have a second entry for the complete download in the apache log.
Looks like IE has to download the while file to examine it and to decide how to open it. But the header of the video is at the beginning (this is why other browser are working), so why is this neccessary?
It was an apache configuration issue!
We are using DEFLATE as OutputFilter also for .php endings, so the transfer-encoding of the video streaming php-script was set to "chunked" which causes IE to completely download the file. Even setting "Content-length" header in the php file did not help. Only way was to disable DEFLATE for this php file.
I’m having a problem getting HTML5 to work in IE9. It showed up as a failure to execute the video tag. It works fine in Firefox, Opera and Safari but I just got a blank screen in IE. This is the code:
<video width="320" height="240" controls="controls">
<source src="video1.mp4" type="video/mp4"/>
<source src="video1.ogg" type="video/ogg"/>
</video>
Then I ran the HTML5 compatibility test at http://html5test.com and I also got a blank screen in IE, so it’s more than the video tag that’s at issue.
Then I tried running an .mp4 sample video online ( http://archive.org/details/Pbtestfilemp4videotestmp4 ) - it does not run within the browser, but opens in VLC player! In Firefox, Opera and Safari, it runs in the browser.
I’ve reinstalled IE – no good. When I check the IE version, it says Internet Explorer 9, but after "Version:", there's a blank.
Any ideas?
I had a similar issue and it turned out that my server wasn't returning the correct MIME type for the video object. Check out this guy's info - http://blogs.msdn.com/b/thebeebs/archive/2011/07/20/html5-video-not-working-in-ie9-some-tips-to-debug.aspx
I just added this code to my .htaccess file and it worked immediately -
AddType video/mp4 .mp4
use [HTML5Shiv] to enable HTML5 tag for Internet Explorer. And add WebM video format to the sources