您的位置：首页 > 其它

使用Flex 和 Red5开发简单视频直播功能

2016-09-17 05:42 721 查看
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的主要区别：

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

经典应用

1、eBay

[b]2、纳斯达克股票市场公司[/b]

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
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航