Home > Developer > Web Develop
The simplest example of Flash-based streaming media: webpage players (HTTP, RTMP, HLS), rtmphls
This article continues with the previous article, recording some Flash-based streaming media processing examples. This article records some Web players based on Flash technology. Compared with other Web players, Flash-based Web players have the biggest advantage of "plug-in-free installation", which greatly improves the user experience quality. Earlier Network Videos (especially live videos) generally used ActiveX controls as video players, which were not widely used. Therefore, end users must download the relevant plug-ins to watch the program, as a result, many users who are not familiar with computers are faced with great obstacles. This obstacle was not solved until the Flash web player appeared. This article will record several commonly used Web players for future development and testing.
This document records the following common web players:
The effect of the player is shown in the figure where the URL of the video file being played is the http://video-js.zencoder.com/oceans-clip.mp4
RTMP Sample Player Flowplayer is a webpage Player extended by RTMP Plugin. The Code is as follows.
<!DOCTYPE html>
Shows the effect of the player. the URL of the video being played in the figure is rtmp: // live.hkstv.hk.lxdns.com/live/hks.
RTMP Sample Player VideoJS
Video. js Official Website: http://www.videojs.com/
Note: Video. js is a JavaScript-based HTML5 Video player, which is open-source.
RTMP Sample Player VideoJS is an RTMP Player Based on Video. js. There are two players:
<!DOCTYPE html>
Shows the effect of the player, with the URL of the video being played in the figure being http://video-js.zencoder.com/oceans-clip.mp4
RTMP Sample Player VideoJS is a Web Player that supports RTMP. The Code is as follows.
<!DOCTYPE html>
Shows the effect of the player. the URL of the video being played in the figure is rtmp: // ams.studytv.cn/livepkgr/264.
RTMP Sample Player Plugin Player
JW Player http://www.jwplayer.com
Note: The latest JW Player version does not seem to support RTMP playback for free. The old JW Player version is used here.
RTMP Sample Player is an RTMP Player Based on JW Player. There are two players:
<!DOCTYPE html>
As shown in the following figure, the current video URL is sintel.mp4.
RTMP Sample Player is a Web Player that supports RTMP. The Code is as follows.
<!DOCTYPE html>
Shows the effect of the player. the URL of the video being played in the figure is rtmp: // wx.cnrmall.com/live/flv
HLS Sample Player FlowplayerHLS Sample Player Flowplayer is a FlowPlayer with the added HLS Plugin extension. After the HLS Plugin is added, FlowPlayer adds support for HLS. The Code is as follows.
<!DOCTYPE HTML>
Shows the effect of the player, with the URL of the video being played in the figure being http://stream.flowplayer.org/drive.m3u8
HLS Video Player Html5 HTML5 Video label reference: http://www.w3school.com.cn/html5/html5_video.asp
HLS Video Player Html5 is a webpage Player that uses the HTML5 <Video> label (actually a webpage ). The source code is as follows.
<!DOCTYPE HTML>
Note that the <video> tag must support HTML in the browser. If the browser does not support HTML5, the following information is displayed when you open the webpage.
If the browser supports HTML5, the effect of opening a webpage is shown in. The URL of the video in the figure is sintel.mp4.
ActiveX VLC Player
ActiveX VLC Player differs greatly from the preceding web Player, and is mainly used for comparison. ActiveX VLC Player is an ActiveX control-based Player. ActiveX-based control means that only IE supports the Web player, and VLC must be installed on the local machine first.
Backed by almost omnipotent VLC Media Player, this webpage Player has a strong performance: not only does it support the HTTP, RTMP, and HLS supported by the various players mentioned above, it also supports MMS, RTSP, and UDP protocols (all protocols supported by VLC Media Player ).
The source code of ActiveX VLC Player is as follows.
<!DOCTYPE HTML>
The player effect is shown in the figure. The URL of the video being played is rtsp: // 58.248.254.7: 9135/live/ds-mmzh.sdp.
Download
Simplest flashmedia example
SourceForge: https://sourceforge.net/projects/simplestflashmediaexample/
Github: https://github.com/leixiaohua1020/simplest_flashmedia_example
Open source China: http://git.oschina.net/leixiaohua1020/simplest_flashmedia_example
CSDN download: http://download.csdn.net/detail/leixiaohua1020/8456499
This project contains the following example of streaming media based on Flash technology:
Simplest_as3_rtmp_player: the simplest RTMP player (based on ActionScript)
Simplest_as3_rtmp_streamer: the simplest RTMP streamer (based on ActionScript)
Rtmp_sample_player_adobe: Test player extracted from Adobe Flash Media Sever
Rtmp_sample_player_wowza: The test player extracted from the Wowza server.
Rtmp_sample_player_flowplayer: RTMP/HTTP Player Based on FlowPlayer (add RTMP plugin)
Rtmp_sample_player_videojs: RTMP/HTTP Player Based on VideoJS
Rtmp_sample_player_audio PLAYER: RTMP/HTTP Player Based on audio player
Hls_sample_player_flowplayer: FlowPlayer-based HLS player (add HLS plugin)
Hls_video_player_html5: HTML5-based HLS/HTTP player
Activex_vlc_player: VLC-based ActiveX Control player
Note: Some players cannot open html pages directly. You need to put the player on the Web server.
(For example, Apache or Nginx)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
