Skip to main content

Playing rtmp streams on a webpage

I don’t understand why there is no opensource way of playing an rtmp stream on a webpage using any of the free opensource players.

The only options available seem to be the flowplayer with a watermark and jwplayer again with a watermark. Then some others have released similar players with watermarks (again). Only premium versions seem to be able to play rtmp streams without watermarks. This is crazy.

Anyway, here is a way to create your own streaming player for the web with no watermarks and top quality for your streams. Soon I will be releasing a totally opensource project on Github about this..

So following my example you will be creating a flash rtmp player.

Just head to Adobe and download a trial version of Flash Builder. At the time of this post the version was 4.6

Install as usual, sign in with a free adobe id to activate the trial and create a new MXML application. Just use all the defaults!

Edit the main.mxml file and add something like this :

<s:VideoPlayer id="vidPlyr"
loop="false"
muted="false"
left="100" right="100"
top="100" bottom="100"
horizontalCenter="0" verticalCenter="0"
autoPlay="true">
<s:source>
<s:DynamicStreamingVideoSource host="rtmp://stream.upg.gr:1935/ioniantv/stream" streamType="live">
<s:DynamicStreamingVideoItem streamName="stream" />
</s:DynamicStreamingVideoSource>
</s:source>
</s:VideoPlayer>

 

Go to Project – Export Release Build

Go where the project is and get the bin-release folder contents and upload them to your server. If you used all the defaults you will be able to access the video page at http://your.domain.com/bin-release/Main.html

You are done!!! Here is your watermark free rtmp streaming player. I believe you get the point and you can start renaming things as needed and adding code to fallback to mobile etc.

Watch this space for a full fallback player that I will be releasing soon. Comment here and I’ll release it sooner 🙂

 

upggr

I am the one