zoukankan      html  css  js  c++  java
  • 使用Flex 和 Red5开发简单视频直播功能

    Flex 是一个高效、免费的开源框架,可用于构建具有表现力的 Web应用程序,这些应用程序利用Adobe Flash Player和Adobe AIR, 可以实现跨浏览器、桌面和操作系统。虽然只能使用 Flex 框架构建 Flex应用程序,但Adobe Flash Builder™(之前称为 Adobe Flex Builder™)软件可以通过智能编码、交互式遍历调试以及可视设计用户界面布局等功能加快开发。
    使用 Flex 创建的 RIA 可运行于装有 Adobe Flash Player 插件的浏览器中,或运行于跨操作系统的 Adobe AIR上,它们可以跨所有主流浏览器、操作系统实现一致的运行。通过利用 AdobeAIR,Flex应用程序可以访问本地数据和系统资源。
    Flex是通过java或者.net等非Flash途径,解释.mxml文件,并生成相应的.swf文件。Flex的component和flash的component很相似,但是有所改进增强。目前Macromedia公司已经被ADOBE公司收购。Adobe2013年01月15日将Flex捐给Apache并发布了Apache Flex4.8。

    Flex和Flash的主要区别:

    1、Flex侧重于应用软件、游戏的开发,flash更侧重于网页web端的展示效果。
    2、Flex生成的swf文件较大,不利于网络传输,flash生成的swf文件较小,适合在网站上展示。

    经典应用

    1、eBay

    2、纳斯达克股票市场公司
     
     

    Red5的主要功能和Macromedia公司的FMS类似,提供基于Flash的流媒体服务的一款基于Java的开源流媒体服务器。它由Java语言编写,使用RTMP作为流媒体传输协议,这与FMS完全兼容。它具有流化FLV、MP3文件,实时录制客户端流为FLV文件,共享对象,实时视频播放、Remoting等功能。用Red5替换FMS后,客户端不用更改可正常运行。

    实例:

    1. 服务器端ApplicationAdapter:示例如下:

    package org.jason.flex01;
    
    import org.red5.server.adapter.ApplicationAdapter;
    
    public class Application extends ApplicationAdapter{
        
    
    }

    2.客户端使用Flex实现摄像头获取视频并发布代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="init()">
        <mx:Script>
            <!--[CDATA[
                import flash.net.NetConnection;
                import flash.net.NetStream;
                import flash.events.NetStatusEvent;
                import mx.controls.Alert;
                
                private var nc:NetConnection;
                private var ns:NetStream;
                private var cam:Camera;
                
                private function init():void{
                    nc = new NetConnection();
                    nc.addEventListener(NetStatusEvent.NET_STATUS,connectServerHander);
                    nc.client  = this;
                    nc.connect("rtmp://58.116.56.68:1935/Flex01");
                }
                
                private function connectServerHander(evt:NetStatusEvent):void{
                    trace(evt.info.code); 
                    cam = Camera.getCamera();
                    
                    if(cam != null){
                        cam.setMode(313,194,30);
                        cam.setQuality(0,70);
                        ns = new NetStream(nc); 
                        ns.attachCamera(cam);
                        ns.publish("red5");
                        
                        var vi:Video = new Video();
                        vi.width = 313;
                        vi.height = 194;
                        vi.attachCamera(cam);
                        videoDisplay.addChild(vi);
                        
                    }else{
                        Alert.show("no Camera");
                    }
                }
                            
                public function onBWDone():void{
                
                }
                
            ]]-->
        </mx:Script>
        
        <mx:VideoDisplay x="162" y="77" width="313" height="194" id="videoDisplay"/>
        
    </mx:Application>

    客户端使用Flex play视频代码如下:

    <?xml version="1.0" encoding="utf-8"?>
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" applicationComplete="init()">
    
        <mx:Script>
            <!--[CDATA[
                
                import flash.display.*;
                import flash.utils.*;
                import flash.events.*;
                import flash.net.*;
                import flash.media.Video;
                import flash.media.Camera;
                
                private var nc:NetConnection;
                
                private function init():void{
                    nc = new NetConnection();
                    nc.connect("rtmp://58.116.56.68:1935/Flex01");
                    nc.addEventListener(NetStatusEvent.NET_STATUS,connectHandler);
                }
    
                private function connectHandler(evt:NetStatusEvent):void{
                    
                    var ns:NetStream = new NetStream(nc);
                    var video:Video=new Video() ;
                    video.width = 313;
                    video.height = 194;
                    video.attachNetStream(ns);
                      ns.play("red5");
                    videoDisplay.addChild(video);
                    
                }
                
            ]]-->
        </mx:Script>
        
        <mx:Panel x="132" y="78" width="356" height="266" layout="absolute" title="现场直播" fontSize="14">
            <mx:VideoDisplay x="10" y="10" width="320" height="193" id="videoDisplay"/>
        </mx:Panel>
        
    </mx:Application>

    参考:Flex语法 --> http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html?utm_source=tuicool

    red5流媒体服务器的搭建--->  http://blog.csdn.net/oldmtn/article/details/47110351

       http://blog.sina.com.cn/s/blog_4829b9400100rmz0.html

  • 相关阅读:
    python基础(1)#1,2,3,4可组成多少不重复的三位数
    HTML/CSS 学习笔记
    (转) 杨元:CSS浮动(float,clear)通俗讲解
    前端:HTML
    Servlet
    Maven 安装
    单例模式
    项目随笔
    树状结构--迭代
    DB的封装
  • 原文地址:https://www.cnblogs.com/jokerjason/p/5877854.html
Copyright © 2011-2022 走看看