使用 Eclipse 创建第一个 Red5 应用程序示例 - 使用 Red5 在线录制视频

本文示例源代码下载地址

书接上回~《如何使用 Red5 插件创建 Red5 项目？》，接下来要做的当然是想看看自己在 Eclipse 开发的应用程序跑的效果。本文使用具体例子——使用 Red5 在线录制视频，介绍怎样让创建的第一个 Red5 应用成功运行。

步骤 1：安装 Red5。

Linux 下可以参考《如何在 Linux 服务器上安装 Red5？》；

Windows 下可以去 http://wiki.red5.org/wiki/0_9_1 下载 setup-Red5-0.9.1.exe，安装步骤基本狂点 "Next"，但最后需要输入 IP 和端口号，那个是测试页面需要的，IP 直接输入 "localhost"，端口号可以输入 5080。值得注意的是，Red5 安装成功后会默认设置服务并且是自动启动，我们需要把它的自动启动设置为手动。因为在 Windows 下的 Red5 是用来测试用的，Eclipse 修改好项目并部署后，debug 启动的
server 就是 Red5，如果 Red5 服务已经启动的话会出错。这个类似于在 Eclipse-Tomcat 下调试项目，我们不会把 Tomcat 作为 Windows 下的服务并自动启动吧？

步骤 2：安装 Red5 的两个 demo。

这个是本示例的需要，安装 messageRecorder 和 oflaDemo 两个 demo。启动 Red5 服务后，访问 http://localhost:5080/，点击页面中的 Install 链接，弹出 Red5 应用安装列表页面，分别选择 messageRecorder，oflaDemo，点击右下角的 Install 按钮进行安装。安装成功后在 Red5 的安装目录下会发现两个新的目录：messageRecorder 和 oflaDemo。

这一步如果不明白的话可以看一下视频 http://www.youtube.com/watch?v=969cmyGu1yw。
步骤 3：在 Eclipse 中创建一个 Red5 项目。

可以参考上一篇博客《如何使用 Red5 插件创建 Red5 项目？》，本文项目名跟该文示例项目名一样，也是 ExampleWebPro。

步骤 4：在 Flex Builder 3 中创建一个新项目。

项目姑且取名为 pzaixianluzhi 吧，pzaixianluzhi.mxml 内容如下：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
	<mx:UIComponent id="ui">
	</mx:UIComponent>
	<mx:Script>
		<![CDATA[
			import mx.controls.Alert;
			private var rtmpURL:String="rtmp://localhost/ExampleWebPro";
			private var conn:NetConnection=new NetConnection();
			private var isConnectSuccess:Boolean=false;
			private var netStream:NetStream;
			private var video:Video=new Video();
			private function clickConnect(e:MouseEvent):void{
				if(!isConnectSuccess){
					conn.addEventListener(NetStatusEvent.NET_STATUS,netStatus);
					conn.connect(rtmpURL);
				}
			}
			private function clickVideo(e:MouseEvent):void{
				video.attachCamera(Camera.getCamera());
				ui.addChild(video);
			}
			private function netStatus(e:NetStatusEvent):void{
				trace(e.info.code);
				if(e.info.code=="NetConnection.Connect.Success"){
					isConnectSuccess=true;
					netStream=new NetStream(conn);
					netStream.client=new StreamClient();
					netStream.attachAudio(Microphone.getMicrophone());
					netStream.attachCamera(Camera.getCamera());
					netStream.publish("nameffff","record");
				}
			}
		]]>
	</mx:Script>
	<mx:Button x="378" y="369" label="录制" click="this.clickConnect(event)"
	fontSize="16"/>
	<mx:Button x="310" y="369" label="视频" fontSize="16"
	click="this.clickVideo(event)"/>
</mx:Application>

pzaixianluzhi.mxml 调用到的 StreamClient.as 源码如下：

package
{
	public class StreamClient
	{
		public function StreamClient()
		{
		}
		public function onMetaData(info:Object):void{
			for(var n:* in info){
				trace(n+":"+info
);
			}
		}
		public function onPlayStatus(info:Object):void{
			for(var n:* in info){
				trace(n+":"+info
);
			}
		}
	}
}

然后点击菜单栏中的 Run 选项，选择 Run pzaixianshipin，在弹出的浏览器中，点击 "视频" 按钮，可以看到自己的本地视频。——现在的笔记本基本都自带视频头了，如果你用的是 PC 机且没视频头，那如果你想跑本文例子的话，还是去借一个视频头吧，哈哈。

步骤 5：调试运行 Red5 项目。

按《如何在 Linux 服务器上安装 Red5？》所说 debug 启动 Red5 Server，然后按步骤 4 点完 "视频" 按钮启动本地视频后点 "录制" 调用 Red5 服务 ExampleWebPro 进行录制，发现 Eclipse 控制台报错，信息如下：

org red5 server net rtmp rtmphandler scope ExampleWebPro not found on localhost

原来 Red5 的 Eclipse 插件不如 Tomcat 的插件似的那么智能，自己写好的程序识别不了。怎么办？

步骤 6：手工配置步骤 3 创建好的 Red5 项目。

将 %Red5%webapps/messageRecorder/WEB-INF 下的 red5-web.properties 和 red5-web.xml 文件复制到 ExampleWebPro 项目的 WEB-INF 下，然后在 web.xml 中添加如下内容：

<context-param>
		<param-name>webAppRootKey</param-name>
		<param-value>/ExampleWebPro</param-value>
	</context-param>

然后编辑 red5-web.properties，将 webapp.contextPath 值修改为 /ExampleWebPro。

步骤 7：再调试 Red5 项目。

重新按照步骤 5 调试运行 Red5 项目，发现运行正常了，%Red5%/webapps/ExampleWebPro 项目下会有 streams 文件夹生成，该文件夹下有我们在线录制的视频 nameffff.flv。成功。