So i can play the stream with Vlc media player .m3u.
.m3u:
http://IP:8000/source
But i cant play it with a browser.
Can you help me?
And im now streaming to the server with obs, im recording a video on it
Yes you can play back many streams that are broadcast through Icecast.
However you don't want to point your player at the m3u file, but directly at the stream URL instead.
There are:
"HTML5" players that use the the <audio> or <video> tags
JavaScript based abstractions on top of the aforementioned
JavaScript 'compiled' players that bring their own decoders and such for browsers that don't support things natively
For the Audio-element there are a few supported formats and I personally use Opus in Ogg.
For the Video-element there are a few supported formats and I personally use Opus + AV1 or Opus + VP9 inside WebM.
Please note that the "container" (WebM, Ogg, MP4, etc.) is relevant, not just the choice of the codec. Especially for web browsers as they tend to support a much smaller subset than dedicated media players.
In "the olden days" there were also Adobe Flash and Java-applet based players, but they really are irrelevant by now.
When it comes to formats, I'd recommend the Opus codec as it is supported by most browser engines nowadays. For some use cases MP3 might be valid and while proprietary is nowadays no longer patent encumbered. AAC might bring licensing requirements for encoders etc. along.
Related
I need to play MPEG-1 files dynamically from a browser. Uploading them to YouTube or converting the videos is not an option.
How can I do this?
I've seen this, but the answers do not apply to MPEG-1. Is there a way to play mpeg videos in HTML5?
The video tag is not working for the file with Chrome:
<video class="fullscreen" autoplay>
<source src="video/test2.mpeg">
</video>
It just displays a black box and stuttering noise/sound. I can verify that the video is not corrupt because I can play it with VLC. I only need this to work on one specific browser (it does not have to be cross-compatible). Plugins are OK too, as long as I do not have to convert the video. Though I'd rather avoid them.
Some browsers don't support older formats in <video> on purpose, to limit number of crappy, legacy, and potentially insecurely implemented video formats on the web.
The only combination that has a decent chance of working is H.264 (MP4) and WebM (or Ogg Theora), so you must convert the video and for good browser support you will have to generate at least these two formats.
The good news is that modern codecs are much more efficient than MPEG-1, so you'll get much smaller files.
Other options may be:
Give users a direct link to the video so they can download it and play in an external player like VLC.
Embed video using oldschool <object> element, and hope some browsers still have legacy plugins that can play videos (but e.g. Chrome has recently removed support for all plugins except a couple written specifically for Chrome's own API).
Use Emscripten (asm.js) to compile an MPEG-1 decoder to JavaScript and decode the video yourself to <canvas>. JS these days is fast enough to pull that off (although it will quickly drain battery of mobile devices, and a poor video codec combined with an extra download of a JS decoder will be a massive waste of bandwidth).
You can play MPEG-1 videos using JSMPEG: https://jsmpeg.com/
Sample code here: https://github.com/phoboslab/jsmpeg/blob/master/view-stream.html
It seems clear that officially the html5 audio tag is intended for use with the ogg format.
Does the html5 audio tag encompass .mid (MIDI) unofficially?
Updates:
This is a somewhat old question but it is still highly ranked on Google so here are some updates to the answers above - standards and tools that may have not been available when the question was asked but may be useful to people who find this question today:
Web MIDI API (this is currently a W3C Editor's Draft from December 26, 2012 - ie. today - so it may change)
MIDI.js - playing MIDI with JavaScript
jasmid - MIDI synthesis with JavaScript
See also those questions:
Generate live MIDI from Javascript
generating MIDI in javascript
In spite of the MIME type "audio/midi" a MIDI file is not audio ... it is a musical performance only, there is no sound. In other words, a MIDI file stores which keys a piano player hit, when he or she hit them, and how hard he or she hit them, but no actual piano sounds. You have to put the musical performance through a sampler that has a piano sound in it, just like you have to put a piano roll through a player piano. Apple QuickTime 7 has such a sampler built-in, but I don't know if QuickTime X does. Anyway, you would have to use an embed tag, it doesn't work through the audio tag.
It seems clear that officially the html5 audio tag is intended
for use with the ogg format.
No. HTML5 is a markup standard. It doesn't address audio standardization at all. In other words, it tells you how to encode markup, not how to encode audio. Audio standardization is done by ISO's Moving Picture Experts Group for the past 20 years now. The current audio standard is MPEG-4 AAC (audio/mp4), and the previous standard is MPEG-2 MP3 (audio/mp3). If you are standardizing your markup to the W3C HTML5 specification, then you should standardize your audio to the ISO MPEG-4 specification. Otherwise, just ignore all standards and use whatever markup and audio you like, and make content that only you can see. All PC's and mobiles support both HTML5 and MPEG-4 out-of-the-box. It is only the alternate browsers that block access to the user's hardware MPEG-4 player, so you should work around those by offering the MP4 audio file to those users as a simple link they can click and open in a helper app, like iTunes (which is on about 90% of all PC's). Or you can invoke a FlashPlayer in those alternate browsers and load the same standard MP4 in there.
As for Ogg, it plays in some alternate browsers, but it doesn't play in the user's RSS reader, Podcast reader, native apps that offer Web views, and in many other contexts that the user may see your web page. Standardized audio plays in all of those contexts. So if you are offering Ogg, you have to offer it as a second choice after MP4, because the Ogg is only going to be needed a small minority of the time.
It doesn't appear to to support raw MIDI files, in Chrome 10 at least.
However, the W3C says it supports XMF which can have MIDI embedded. Not sure about browser support though.
To quote from the official Web MIDI API page (http://www.w3.org/TR/webmidi):
To some users, "MIDI" has become synonymous with Standard MIDI Files and General MIDI. That is not the intent of this API; the use case of simply playing back a .SMF file is not within the purview of this specification (it could be considered a different format to be supported by the HTML5 <audio> element, for example).
In other words, W3 Org says browser support for simple MIDI files should be through the HTML5 tag. Sadly, as far as I know, no browser yet supports MIDI via the <audio> tg. But I'll bet that the first one which does is going to get a huge chunk of market share. For example, the site at http://www.hymntime.com/tch has thousands of MIDI files that still have to use the old <object> tag to play. And even then, it still requires a plugin. Try explaining to a non-technical user what a "plugin" is or how to install one!
Browsers are not required to support any specific codecs or encodings by the HTML5 spec. There is some discussion around supporting MIDI-like sound behaviour in the future, but not much - these two posts on the mailing list last year didn't get any direct responses.
I know that QuickTime does (or used to?) support MIDI, and Safari will play any audio that QuickTime supports, so it may work already in Safari but I haven't tried it.
I am redesigning a music player. It currently uses Soundmanager2 V2.97a.20110801. But now since the HTML5 is so easy to use, is there much of a reason why I should continue using Soundmanager2? Or are there advantages to it that I am unaware of? Could you possibly help with a simple compare and contrast of the 2?
Soundmanager uses flash, HTML5 audio uses the native capabilities of the browser. A pitfall with <audio> is that you'll have to encode your audio at least twice, as mp3 and ogg.
Another thing is that older browsers, IE8 in particular, don't support <audio>. You may want to detect* audio support, and, if not, fall back to Soundmanager.
About audio codecs
This web page talks about <video>, but detecting <audio> is done almost the same way.
the HTML5 audio tag is still a work in progress and unfortunately still has too many browser specific differences in supported audio formats for an easy cross browser solution.
it still varies widely depending upon what you want to accomplish.
here is a link to the info you should read through:
http://www.schillmania.com/projects/soundmanager2/doc/getstarted/#intro
this may be a little off topic but i built an opensource audio library on github for playing multichannel sounds like this...
// play the lowest piano key (1)
jThump( 1, 'piano' );
// play the highest piano key (88)
jThump( 88, 'piano' );
below is a simple demo that plays random notes when you press the 'z' key
http://jthump.com
I am embedding a video feature on my website, and I am planning to use HTML5 player to play those videos.
2 questions:
1. Which formats should I encode the uploaded videos to (I need mobile support + PC + mac).
2. How can I prevent people from downloading the movie (HTML5 plays directly from my CDN, hence the link can be fetched easily)
Can CDN protect the content by issuing an access token that will expire in X time?
Thanks all!
1)
If you need to support also Firefox 3.6 you will need to ensure at least 3 formats: mp4, webm and ogv. Otherwise mp4 and webm are enough. mp4 is loaded by the apple mobile devices (ipad, iphone), Safari and it can be loaded by a flash player (supposing you have installed flash player plugin 9r3 as a minimum version). webm is supported by firefox and chrome
http://diveintohtml5.info/video.html#what-works
2)
take a look at How to prevent downloading HTML5 videos
First, Zencoder has a fantastic page on HTML5 video encoding recommendations:
The minimum for HTML5 video is MP4 + WebM or Ogg (or both), using the MP4 version for Flash fallback.
For mobile support, one H.264/MP4 output can take you a long way. 2-3 enables better quality and wider compatibility.
Second, at the moment, your videos will be downloadable with minimal effort (e.g., View Source). See the related question, "Is there a way to use DRM on HTML5 video?"
The HTML5 specification allows for any video format.It is the browser implementation that determines what formats are actually supported.
MP4 container with H.264 Video and AAC Audio
MP4/H.264 is supported by Safari and IE9+. You may find support in some versions of Chrome.
WebM container with VP8 Video and Vorbis Audio
WebM/VP8 is supported by Firefox, Chrome and Opera.
Ogg container with Theora Video and Vorbis Audio
Ogg/Theora is supported by Firefox, Chrome and Opera.
Bottom-Line
Use more than one format to be assured your client doesn't see blank frame.
As far as the Content Protection, I am bit short on that knowledge and also suppose that it doesn't make sense to go after this issue when your user might be running a slow connection
For content protection. seems like, today there is no straight forward way to do this. However, there is an active interest inside HTML5 camp where some form of DRM can be applied for this.
See this: http://gigaom.com/video/mdialog-tackles-html5-video-security/
It seems clear that officially the html5 audio tag is intended for use with the ogg format.
Does the html5 audio tag encompass .mid (MIDI) unofficially?
Updates:
This is a somewhat old question but it is still highly ranked on Google so here are some updates to the answers above - standards and tools that may have not been available when the question was asked but may be useful to people who find this question today:
Web MIDI API (this is currently a W3C Editor's Draft from December 26, 2012 - ie. today - so it may change)
MIDI.js - playing MIDI with JavaScript
jasmid - MIDI synthesis with JavaScript
See also those questions:
Generate live MIDI from Javascript
generating MIDI in javascript
In spite of the MIME type "audio/midi" a MIDI file is not audio ... it is a musical performance only, there is no sound. In other words, a MIDI file stores which keys a piano player hit, when he or she hit them, and how hard he or she hit them, but no actual piano sounds. You have to put the musical performance through a sampler that has a piano sound in it, just like you have to put a piano roll through a player piano. Apple QuickTime 7 has such a sampler built-in, but I don't know if QuickTime X does. Anyway, you would have to use an embed tag, it doesn't work through the audio tag.
It seems clear that officially the html5 audio tag is intended
for use with the ogg format.
No. HTML5 is a markup standard. It doesn't address audio standardization at all. In other words, it tells you how to encode markup, not how to encode audio. Audio standardization is done by ISO's Moving Picture Experts Group for the past 20 years now. The current audio standard is MPEG-4 AAC (audio/mp4), and the previous standard is MPEG-2 MP3 (audio/mp3). If you are standardizing your markup to the W3C HTML5 specification, then you should standardize your audio to the ISO MPEG-4 specification. Otherwise, just ignore all standards and use whatever markup and audio you like, and make content that only you can see. All PC's and mobiles support both HTML5 and MPEG-4 out-of-the-box. It is only the alternate browsers that block access to the user's hardware MPEG-4 player, so you should work around those by offering the MP4 audio file to those users as a simple link they can click and open in a helper app, like iTunes (which is on about 90% of all PC's). Or you can invoke a FlashPlayer in those alternate browsers and load the same standard MP4 in there.
As for Ogg, it plays in some alternate browsers, but it doesn't play in the user's RSS reader, Podcast reader, native apps that offer Web views, and in many other contexts that the user may see your web page. Standardized audio plays in all of those contexts. So if you are offering Ogg, you have to offer it as a second choice after MP4, because the Ogg is only going to be needed a small minority of the time.
It doesn't appear to to support raw MIDI files, in Chrome 10 at least.
However, the W3C says it supports XMF which can have MIDI embedded. Not sure about browser support though.
To quote from the official Web MIDI API page (http://www.w3.org/TR/webmidi):
To some users, "MIDI" has become synonymous with Standard MIDI Files and General MIDI. That is not the intent of this API; the use case of simply playing back a .SMF file is not within the purview of this specification (it could be considered a different format to be supported by the HTML5 <audio> element, for example).
In other words, W3 Org says browser support for simple MIDI files should be through the HTML5 tag. Sadly, as far as I know, no browser yet supports MIDI via the <audio> tg. But I'll bet that the first one which does is going to get a huge chunk of market share. For example, the site at http://www.hymntime.com/tch has thousands of MIDI files that still have to use the old <object> tag to play. And even then, it still requires a plugin. Try explaining to a non-technical user what a "plugin" is or how to install one!
Browsers are not required to support any specific codecs or encodings by the HTML5 spec. There is some discussion around supporting MIDI-like sound behaviour in the future, but not much - these two posts on the mailing list last year didn't get any direct responses.
I know that QuickTime does (or used to?) support MIDI, and Safari will play any audio that QuickTime supports, so it may work already in Safari but I haven't tried it.