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.
Related
<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'm creating my own audio, without controls of the browser.
<audio src="http://50.7.98.194:8081/~dl3/cgi-bin/dl.cgi/bqmu5mltxcqy43mxecgo4gnw743qr7fd7io22q5xj4/gl1mwvp6b326.mp3" id="audio">
</audio>
I have these functions, called when clicked some buttons:
function play()
{
audio.play();
}
function play()
{
audio.pause
}
function stop()
{
audio.pause();
audio.src = audio.src;
}
But for now, I only can reproduce mp3 or ogg files, but not a live stream radio.
I read about some plugins, but I need do it with pure html5.
Could you help me, please?
Thanks very much,
Playing audio from a "live source" seems to be supported by modern browsers. Basically just use the normal HTML 5 audio tags, and input the "live stream" URL as the source, ex:
<audio controls>
<source src="http://audio-mp3.ibiblio.org:8000/wcpe.mp3" type="audio/mpeg">
<source src="http://audio-ogg.ibiblio.org:8000/wcpe.ogg" type="audio/ogg">
</audio>
And the stream "just works" as it were, though attempting to seek with the default controls does nothing. So eventually you may want to replace the controls with "custom" ones, in normal HTML 5 media style. For backward compatibility to non HTML 5 browsers, this project may be useful: https://github.com/etianen/html5media/wiki/Embedding-audio (haven't tested it with live streaming but could/should work). Mp3 codec seems to be supported in major browsers (barring possibly firefox on Linux [?]). Opus might be another nicely cross platform option, I'm not sure codec wise what is the "best" choice as it were.
With some streams (shoutcast I presume) I have had to add a closing ';' to the URL, see https://stackoverflow.com/a/3182814/32453 for notes there, but that's basically just to get the "right" url.
Unfortunately, there is still no single video and audio codec, which is supported by all browsers! The programmers have to ensure that there is fallback provided for use-cases where browser A doesn't support codec B and vice versa.
You can take a look at this compatibility table, for both desktop and mobile browsers.
Desktop:
Internet Explorer (9.0+) support MP3 and AAC codecs
Chrome (6.0+) support Ogg Vorbis, MP3, WAV+
Firefox (3.6+) support Ogg Vorbis, WAV
Safari (5.0+) support MP3, AAC, WAV
Opera (10.0+) support Ogg Vorbis, WAV
Mobile:
Opera Mobile (11.0+) supported codecs are device-dependent
Android (2.3+) supported codecs are device-dependent
Mobile Safari (iDevices with iOS 3.0+) support MP3, AAC
Blackberry (6.0+) support MP3, AAC
Since flash is still widespread enough, it's probably the safest fallback.
Also, I want to note that there's nothing worse to use some library, some of them (e.g. jPlayer) provides very powerful interface and this only can help you to produce better code!
I think you can find everything you want to know in the following article: HTML5 Audio Radio Player by Opera Devs
So, I'm building a website on which users can upload an watch videos.
I'm using the standard HTML5 video player (<video...> <src>...)
Currently, I use multiple sources: MP4, OGG and WEBM, for cross-browser compatibility
Due to the fact that maintaining three formats is both CPU intensive (converting) as well as eating away precious disk space, I started searching the need to find out whether it's really needed to support this three formats
According to the chart I found on Wikipedia (http://en.wikipedia.org/wiki/HTML5_video),
OGG and MP4 should be sufficient, as all browsers seem to be supporting at least one of these formats
... or am I missing something?
For a comprehensive answer see: http://diveintohtml5.info/video.html There's a compatibility matrix toward the bottom that is beginning to be outdated, but was authoritative at the time the article was written.
Firefox 3.5+ supports Theora video and Vorbis audio in an Ogg container. Firefox 4+ also supports WebM.
Opera 10.5+ supports Theora video and Vorbis audio in an Ogg container. Opera 10.60 (and later) also supports WebM.
Chrome 3.0+ supports H.264, Theora video and Vorbis audio in an Ogg container. Chrome 6.0+ also supports WebM.
Safari on Macs and Windows PCs 3.0+ will support anything that QuickTime supports. In theory, you could require your users to install third-party QuickTime plugins. In practice, few users are going to do that. So you’re left with the formats that QuickTime supports “out of the box.” This is a long list, but it does not include WebM, Theora, Vorbis, or the Ogg container. However, QuickTime does ship with support for H.264 video (main profile) and AAC audio in an MP4 container.
Mobile phones like Apple’s iPhone and Google Android phones support H.264 video (baseline profile) and AAC audio (“low complexity” profile) in an MP4 container.
Adobe Flash (9.0.60.184 and later) supports H.264 video (all profiles) and AAC audio (all profiles) in an MP4 container.
Internet Explorer 9+ supports all profiles of H.264 video and either AAC or MP3 audio in an MP4 container. It will also play WebM video if you install a third-party codec, which is not installed by default on any version of Windows. IE does not support other third-party codecs (unlike Safari, which will play anything QuickTime can play).
Internet Explorer 8 has no HTML5 video support at all, but virtually all Internet Explorer users will have the Adobe Flash plugin. Later in this chapter, I’ll show you how you can use HTML5 video but gracefully fall back to Flash.
What formats Google TV browser(Google Chrome) html5 "audio" tag supports? I have an issue with playback of streaming links. I have already seen this link(http://code.google.com/p/googletv-issues/issues/detail?id=5) but is there official approving and more deeply problem explanation?
Checked Chrome/11.0.696.77 on my Google TV using html5test.com and here is the result for audio/video:
Video: MPEG-4 and H.264 supported but not Ogg Theora and WebM
Audio: ACC and MP3 supported but not PCM, Ogg Vorbis, WebM
Interestingly my Mac Chrome 18.0.1025.165 supports H.264, Ogg Theora and WebM but not MPEG-4 for video and all five for audio.
You could try out http://html5test.com/ to check for all HTML5 supported features in GoogleTV browser including supported audio formats.
This is the list of supported audio formats for Google Tv Browser:
If you find any issues, please report it at:
http://code.google.com/p/googletv-issues/
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/.