среда, 25 июля 2012 г.

FlowPlayer (с плагинами для ipad и rtmp)

Для транслирования файлов я использую Wowza Media Server.
Как его настроить читаем тут: 
http://rfedorov.blogspot.com/2012/07/wowza-media-server-centos-6.html


Cкачиваем и распаковываем 
wget http://releases.flowplayer.org/flowplayer/flowplayer-3.2.12.zip 
wget http://releases.flowplayer.org/js/flowplayer.ipad-3.2.10.min.js
wget http://releases.flowplayer.org/flowplayer.rtmp/flowplayer.rtmp-3.2.10.swf

Показываем видео файл на Apple IOS с web сервера (apache/nginx)
Создаем файл html


<html><head>
<title>test</title>
<script type="text/javascript" src="flowplayer-3.2.11.min.js"></script>
<script type="text/javascript" src="flowplayer.ipad-3.2.10.min.js"></script>
</head>
<body>


<div id="ipad" style="display:block;width:425px;height:300px;"></div>
<script type="text/javascript">
$f("ipad", "flowplayer-3.2.12.swf", { 
   clip: {
   ipadUrl: 'http://192.168.1.1/video.mp4'}
   }).ipad();
</script>
</body></html>


Трансляция MP3 live потока (с поддержкой Apple IOS)
Пример вставляемого кода:
<script type="text/javascript" src="flowplayer.ipad-3.2.10.min.js"></script>
<script>
$f("audio", "flowplayer-3.2.12.swf", {
    plugins: {
        rtmp: {
            url: "flowplayer.rtmp-3.2.10.swf",
            netConnectionUrl: 'rtmp://192.168.2.152:1935/apple'
        },
        controls: {
            url: 'flowplayer.controls-3.2.12.swf', 
            fullscreen: false,
            height: 30,
            autoHide: false
        }
    },
    clip: {
        ipadUrl: 'http://192.168.1.1:1935/apple/apple/playlist.m3u',
        url: 'apple',
        provider: 'rtmp',
        autoPlay: false,
        live: true
    }
}).ipad();
</script>

Трансляция видео файла через RTMP (требуется flash)
Пример вставляемого кода:
<script type="text/javascript" src="flowplayer.ipad-3.2.10.min.js"></script>
<a href="" style="display:block;width:425px;height:300px;" id="video"></a>


<script>
$f("video", "flowplayer-3.2.12.swf", {
    clip: {
        url: 'mp4:test/video.mp4',
        scaling: 'fit',
        provider: 'hddn'
    },


    plugins: {
        hddn: {
            url: "flowplayer.rtmp-3.2.10.swf",
            netConnectionUrl: 'rtmp://192.168.1.1:1935/test'
        }
    }
});
</script>

Трансляция MP3 (live) потока через RTMP (требуется flash)
Пример вставляемого кода:
<a href="mp3:apple" style="display:block;width:425px;height:30px;" id="audio"></a>


<script>
$f("audio", "flowplayer-3.2.12.swf", {
    plugins: {
        rtmp: {
            url: "flowplayer.rtmp-3.2.10.swf",
            netConnectionUrl: 'rtmp://192.168.1.1:1935/live',
            durationFunc: 'getStreamLength'
        },
        controls: {
            fullscreen: false,
            height: 30,
            autoHide: false
        }
    },
    play: null,
    clip: {
        url: 'live',
        provider: 'rtmp',
        autoPlay: false
    }
});
</script>

Комментариев нет:

Отправить комментарий