How can I play .mp4 videos using HTML5 using the video tag? Does chrome support HTML5 with .mp4 videos?
Safari can play h264 encoded mp4 videos, Chrome nolonger supports them, Firefox never did. If you pick Google's WebM format, it will work in both Chrome and Firefox.
chrome does support MP4 video with H.264 video codec, But it can only play video with "Baseline profile" of H.264.
The state of media currently with browsers is that you will likely not find a format that works with all browsers, so you will need to encode your video/audio in at least 2 or 3 different formats. There is a nice jQuery plugin called jPlayer that I would heartily recommend if you're going to start out with HTML5 media. The documentation is pretty good and it will really help you work with different browsers. http://jplayer.org/.
Related
I tried the following code below:
<audio src="http://XXX.XXX.XXX.XXX:XXXX/;" controls autoplay></audio>
I'm using Mac and this code worked fine with Safari but not with Chrome or Firefox.
Is there any solution using only HTML5? If not, can I make a fallback with some Flash open source library? How?
There might be some third party audio player for aac but I will share some links on my vast search I did
1 - HE AAC support
As per this post and also wiki pedia HEAAC
It says chrome supports HE-AAC
and here is a stack overflow post that will I guess help you to move formward.
SO AAC support
And here is another link saying chrome supports
**The MP4 container format with the H.264 video codec and either the AAC audio codec or the MP3 audio codec is natively supported by Internet Explorer, Safari and Chrome, but Chromium and Opera do not support the format. Firefox will soon support the format, but only when a third-party decoder is available.
The MPEG media formats are covered by patents, which are not freely licensed. All the necessary licenses can be bought from MPEG LA. Since H.264 is currently not a royalty free format, it is unfit for the open web platform, according to Mozilla [1, 2], Google [1, 2] and Opera. However, since royalty free formats are not supported by Internet Explorer and Safari, Mozilla has decided to support the format anwyay, and Google never fulfilled their promise to remove support for it in Chrome.**
LINK : AAC Support
Please let me know if any of the link is help ful
No AAC is only supported by Safari and Internet Explorer. Here is a list for audio file support.
IE - MP3, AAC
Chrome - OGG, MP3, WAV
Firefox - OGG, WAV
Safari - MP3, AAC, WAV
Opera - OGG, WAV
I assume that listeners are using the latest versions of each browser.
You can create a WAV and a AAC stream and provide the AAC if listener is using IE with html if-else hacks. But this solution is costly.
I've had the same issue. With Chrome, try using a video tag instead of an audio one:
<video controls="controls" width="100%" height="60px">
<source src="xxxxxxxxxxx"/>
Your browser does not support video.
</video>
The only issue is that the Play/Stop controls hides automatically.
<video id="live" autoplay controls>
<source src="http://[WOWZA-IP]:1935/Live/mp4:[LIVESTREAMNAME]/playlist.m3u8" type="video/mp4" />
</video>
I am trying to play h264 encoded live stream using html5 video tag. Live stream is broadcasted by wowza media server and when visiting src link I get a valid playlist file. When trying to play the stream on android chrome browser, player does nothing and shows black screen.
Is this html5 video tag related issue or maybe broadcaster?
These are the formats you can play using html5 source tags.
Think of a video format as a zip file which contains the encoded video stream and audio stream. The three formats you should care about for the web are (webm, mp4 and ogv):
.mp4 = H.264 + AAC
.ogg/.ogv = Theora + Vorbis
.webm = VP8 + Vorbis
There is actually a good range of solutions for this. One solution would be to detect if HLS can be played:
document.createElement('video').canPlayType('application/vnd.apple.mpegURL') !== ''
However, this would not allow you to play HLS content on devices which do not support playback. At this moment, playback is only supported on Microsoft Edge, iOS Safari, OS X Safari and Android (however, I strongly advise against using HLS on Android due to limitations)
An other solution to play HLS across all platforms in HTML5 is to use an HTML5 HLS player such as THEOplayer. They managed to allow HLS to be played on all popular platforms and devices, including those without Media Source Extension support. Currently, the list of supported browsers and platforms includes: Internet Explorer, Edge, Firefox, Chrome, Opera and Safari on Windows, Linux, Mac OS X, Android, iOS and Windows Phone.
On Browsers supporting Media Source Extension you can use https://github.com/dailymotion/hls.js
For workarounds using flash, you can use FlasHLS chromeless player.
Try FlowPlayer. It provides a full HLS support with the least effort in server side!
I am having trouble playing the .ogv file in firefox. here's the link
http://vectisgroup.com/. I think my syntax for html5 video tag was correct because its playing oon other browsers. thanks in advance!
Looking at W3Schools, there are only 3 video formats generally supported. They are MP4, WebM and Ogg. If possible, try converting your video to one of these formats and see if that resolves it.
So I accidentally opened an mkv video file with Chrome, and to my surprise it played it using the native player:
<video src="video.mkv"></video>
It was playing perfectly. HTML5 video supports matroska container?
HTML5 doesn't support any video formats, or rather HTML5 doesn't specify what formats browsers should support. It's up to the browsers to decide which formats they choose to support. Apparently Chrome plays .mkv, but I wouldn't be surprised if other browsers didn't play the same file.
The website has probably set the mimetype of the file to video/webm. Chrome will open this inline rather than forcing a download (because otherwise it doesnt know what to do with it or how to open it).
E.g., in apache this is done by using the AddType directive (can be done in a htaccess):
AddType video/webm .mkv
I'd be surprised if browsers didn't support mkv, as the webm container is just a restricted version of the matroska format. Beyond that you'd have to check the codec of the video inside, and ensure your browser can handle that. If the video format is VP8 or VP9 and the audio is Opus or Vorbis it's webm compliant and might as well be renamed as such. Note that H.264, H.265 and MP3 are not webm compliant and you should avoid using that extension on files that include those formats, the video would still play but it would technically break the webm specification and is frowned upon.
I offer some video using videotag and videojs to support muliple browsers. It works very well in most browsers but IE9. Some IE9 users can't play the video and they doesn't have the Media Player in common. After installed Media Player, it works.
So, does IE9 use codec from Media Player, and it doesn't embed? If it does, it'd be a big accessibility problem, I think.
Which video formats are you serving up? IE9 supports MP4 natively, and WebM if the correct plugin is installed.