随笔-254  评论-3298  文章-48  trackbacks-74

FMS3系列(五):通过FMS实现时时视频聊天(Flash|Flex)

      本系列的前几篇文章中分别介绍了,连接FMS服务器、建立播放程序以及在线视频录制以及回放等功能的实现。相信看过前面几篇文章的朋友已经对FMS有了一定的认识,并熟悉了常用的编程模式。本文将结合前面几篇文章所出现的技术点,来实现一个时时视频聊天程序。

      通过FMS实现视频时时聊天其实很简单,也就是操作时时流。如果是单向视频聊天,则两端一边一边为发布端一边为订阅端,如果是双向视频聊天,则两边都分别是发布端和订阅端。

      如果从技术实现上来分析,单向视频聊天就是一边发布流另一边播放流,双向视频聊天则是两边都需要提供两个流,一个负责发布流,一个负责播放流。在说专业点就是一个创建流并且发送到服务器的客户端叫发布,一个创建流来接受内容的客户端叫订阅,当同一个客户端同是发布和订阅时,它必须创建两个流,一个是输出流,一个是接受流。

       说了这么多下面看看具体是怎么实现的,要实现视频聊天上面分析过,就是一边发布时时视频流一边播放,这同样离不开连接FMS,代码如下:

private function onPublishClick(evt:MouseEvent):void
{
      nc 
= new NetConnection();
      nc.connect(
"rtmp://localhost/LiveStreams");
      nc.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
}

 

       通过点击按扭连接(NetConnection)FMS服务器,然后向FMS发布(publish)视频流,达到视频发布的目的。这里需要注意一点,在发布方法publish()中后一参数为“live”,表示时时视频流。以live的形式发布的流不会在FMS里生成.fla文件,不同于“record”录制视频流生成.flv的视频文件。

private function onNetStatusHandler(evt:NetStatusEvent):void
 {
       trace(evt.info.code);
       
if(evt.info.code=="NetConnection.Connect.Success")
       {
           ns
=new NetStream(nc);
           ns.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
           ns.client
=new CustomClient();
           ns.attachCamera(cam);
           ns.attachAudio(mic);
           ns.publish(txtInput.text,
"live");
       }
}

 

      实现视频发布的核心技术点就是获取视频、音频数据,分别通过Camera和Microphone的静态方法实现。参考代码:

public function PublishStream():void
{
    btnPublish.label
="发布视频";
    btnPublish.addEventListener(MouseEvent.CLICK,onPublishClick);
            
    
//获取视频和声音,并将视频显示到Flash界面
    cam = Camera.getCamera();
    mic 
= Microphone.getMicrophone();
    video 
= new Video(320,240);
    video.attachCamera(cam);
    video.x
=20;
    video.y
=20;
    addChild(video);
}

 

      通过以上步骤就完成了视频聊天的视频流发布端的开发,完整的示例代码如下:

package
{
    import flash.net.
*;
    import flash.events.
*;
    import flash.display.
*;
    import flash.media.
*;
    import fl.controls.
*;
    
    
public class PublishStream extends Sprite
    {
        
private var video:Video;
        
private var nc:NetConnection;
        
private var ns:NetStream;
        
private var cam:Camera;
        
private var mic:Microphone;
        
        
public function PublishStream():void
        {
            btnPublish.label
="发布视频";
            btnPublish.addEventListener(MouseEvent.CLICK,onPublishClick);
            
            
//获取视频和声音,并将视频显示到Flash界面
            cam = Camera.getCamera();
            mic 
= Microphone.getMicrophone();
            video 
= new Video(320,240);
            video.attachCamera(cam);
            video.x
=20;
            video.y
=20;
            addChild(video);
        }
        
        
private function onPublishClick(evt:MouseEvent):void
        {
            nc 
= new NetConnection();
            nc.connect(
"rtmp://localhost/LiveStreams");
            nc.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
        }
        
        
private function onNetStatusHandler(evt:NetStatusEvent):void
        {
            trace(evt.info.code);
            
if(evt.info.code=="NetConnection.Connect.Success")
            {
                ns
=new NetStream(nc);
                ns.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
                ns.client
=new CustomClient();
                ns.attachCamera(cam);
                ns.attachAudio(mic);
                ns.publish(txtInput.text,
"live");
            }
        }
    }
}

 

      视频接收端相对发布端更简单,提供一个NetConnetion连接到发布端的FMS,通过NetStream播放时时视频流就完成。代码很简单,基本上都是在本系列前几篇文章中出现过的代码片段整合而成,详细见下代码块:

package
{
    import flash.net.
*;
    import flash.events.
*;
    import flash.display.
*;
    import flash.media.
*;
    
    
public class LiveStream extends Sprite
    {
        
private var video:Video;
        
private var nc:NetConnection;
        
private var ns:NetStream;
        
        
public function LiveStream():void
        {
            nc 
= new NetConnection();
            nc.connect(
"rtmp://localhost/LiveStreams");
            nc.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
        }
        
        
private function onNetStatusHandler(evt:NetStatusEvent):void
        {
            
if(evt.info.code=="NetConnection.Connect.Success")
            {
                ns
=new NetStream(nc);
                ns.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
                ns.client
=new CustomClient();
                video
=new Video();
                video.attachNetStream(ns);
                ns.play(
"1111");//1111为流的名字,对应于视频流发布端的publish("1111","live").
                addChild(video);
            }
        }
    }
}

 

      OK,到这里视频聊天的两端都完成了,如果需要做双向视频聊天,只需要在每一边多提供一个流就可以了,两端都实现发布视频流和接收视频流数据。

      或许看完文章的朋友回问到CustomClient是那里来的,CustomClient是为了处理元数据的,可以通过元数据向实况视频添加一些格外的属性,本文暂时不讨论,有兴趣的朋友可以查看官方文档了解。

本文示例程序下载:点击下载Flash版示例源代码    点击下载Flex版示例源代码 

版权说明

  本文属原创文章,欢迎转载,其版权归作者和博客园共有。  

  作      者:Beniao

 文章出处:http://beniao.cnblogs.com/  或  http://www.cnblogs.com/

 

posted on 2009-04-28 00:26 Bēniaǒ 阅读(8329) 评论(40) 编辑 收藏

评论:
#1楼 2009-04-28 08:32 | lihaijia[未注册用户]
谢谢,代码发一份 lihaijialhj@163.com
 回复 引用   
#2楼 2009-04-28 08:44 | 猪怕壮      
能给我一份flex的源码么,谢谢
qdzhaokun@163.com

 回复 引用 查看   
#3楼 2009-04-28 09:15 | cumt吴波      
cumt2003@126.com
谢谢,来份源码,学习一下

 回复 引用 查看   
#4楼 2009-04-28 09:32 | ringman[未注册用户]
能给我一份flex的源码么,学习一下,谢谢
 回复 引用   
#5楼 2009-04-28 09:59 | sidesky      
谢谢分享,麻烦发我一份哦!
z2eye@163.com

 回复 引用 查看   
#6楼 2009-04-28 10:56 | Willis[未注册用户]
369662439@163.com
谢谢,来份源码,学习一下

 回复 引用   
#7楼 2009-04-28 12:50 | ︶ㄣ木べ头      
xant000#qq.com
麻烦也给我来份源码

 回复 引用 查看   
#8楼 2009-04-28 12:55 | suim      
麻烦给我一份flex源码
mysuim@gmail.com

 回复 引用 查看   
#9楼[楼主] 2009-04-28 13:28 | Bēniaǒ      
@lihaijia
@cumt吴波
@sidesky
@Willis
@︶ㄣ木べ头
如果要Flash的代码上面有下载连接。

 回复 引用 查看   
#10楼 2009-04-28 15:24 | Kevan      
又来支持楼主了,,请给我一份FLEX源代码,谢谢!
 回复 引用 查看   
#11楼 2009-04-28 22:53 | chenyue[未注册用户]
顶!!
 回复 引用   
#12楼 2009-04-28 23:10 | trueneter[未注册用户]
这个不顶不行,请麻烦也传一份FLEX的给我,感谢!
 回复 引用   
#13楼[楼主] 2009-04-29 01:13 | Bēniaǒ      
@trueneter
@chenyue
@Kevan
大哥些,你们要代码给个地址啊.不然我不小得发到那啊...
前面留言的几位朋友我已经将Flash和Flex两个版本的代码发到邮箱里了.........

Flex版也可直接从本文未的连接下载

 回复 引用 查看   
#14楼 2009-04-29 10:26 | aierong      
ding
 回复 引用 查看   
#15楼 2009-04-29 11:19 | 被偷De贼      
发现楼主对Flex方面研究很多O~
回头联系,请教一下!!

 回复 引用 查看   
#16楼[楼主] 2009-04-29 13:09 | Bēniaǒ      
@aierong
^.^

 回复 引用 查看   
#17楼[楼主] 2009-05-12 23:26 | Bēniaǒ      
@被偷De贼
一起学习.

 回复 引用 查看   
#18楼 2009-05-22 01:34 | 花猫
真是好东西啊!太感谢楼主了。
 回复 引用   
#19楼 2009-05-26 10:30 | Aidey[未注册用户]
楼主好人啊

能不能给我发一份

aidey_hui@163.com

万分感激

 回复 引用   
#20楼[楼主] 2009-05-26 14:33 | Bēniaǒ      
@Aidey
@花猫
点击下载Flash版示例源代码 点击下载Flex版示例源代码

上面有提供下载.

 回复 引用 查看   
#21楼 2009-07-07 13:37 | fenglingfly[未注册用户]
(版本更新V2.0)网络视频系统,全新B/S架构无需插件。接受定制开发,或共同合作运营!QQ:94519359 http://hi.baidu.com/fenglingfly/blog/item/fbd25ad3d04b003d960a164e.html
 回复 引用   
#22楼 2009-07-07 17:09 | 就是看不惯你[未注册用户]
@fenglingfly
...........宝气,发广告发到这里来了。

 回复 引用   
#23楼 2009-07-30 10:33 | 软件下载[未注册用户]
http://0days.51cc.net/0days/adobe.flash.media.server.v3.5.incl.keymaker-embrace_8923.html
Adobe Flash Media Server 系列产品已成为流视频和实时通信领域业界领先的解决方案。Adobe Flash 平台无处不在, 它通过与全球 98% 的计算机采用的 Adobe Flash Player 运行时紧密集成, 几乎跨所有操作系统和屏幕提供了丰富的查看体验。
包含注册讯息。

 回复 引用   
#24楼 2009-08-12 16:18 | crelt[未注册用户]

非常好的学习资料,我想要fms 服务端的 main.asc文件代码例子,另外,再多给几个main.asc文件代码例子,正学习呢,谢谢
crelt@126.com

 回复 引用   
#25楼[楼主] 2009-08-14 02:53 | Bēniaǒ      
@crelt
最近一直很忙,很久都没更新过blog了。空了我分享点通信文件相关的资料。

 回复 引用 查看   
#26楼 2009-08-26 16:35 | 视频[未注册用户]
问下啊
你这个下载需要怎么才能让它跑起来啊!程序!

 回复 引用   
#27楼[楼主] 2009-08-26 17:14 | Bēniaǒ      
@视频
先安装FMS,然后配置下FMS里的应用就OK了。

 回复 引用 查看   
#28楼 2009-09-08 10:48 | phoenixshow      
我将订阅端和发布端分别放入两个.jsp页,可是由局域网访问本机发布端页面时,本机的订阅端收不到视频流,只有在本机发布视频流订阅端才能接收到,想请教楼主是什么原因,应当怎样修改?
 回复 引用 查看   
#29楼[楼主] 2009-09-08 13:15 | Bēniaǒ      
@phoenixshow
这个我也说不清楚,有很多种可能。你只有跟踪下代码了。

 回复 引用 查看   
#30楼 2009-11-09 11:21 | javaquantang[未注册用户]
楼主最近我在研究这个..似乎这方面的资料比较少..能给我一封源码吗...
 回复 引用   
#31楼[楼主] 2009-11-11 13:39 | Bēniaǒ      
@javaquantang
文章里已放出了全部代码。

 回复 引用 查看   
#32楼 2010-03-11 18:30 | jflc      
如果用。net开发flex,需要哪些工具?
 回复 引用 查看   
#33楼 2010-03-11 18:34 | jflc      
怎么配置?麻烦介绍一下,新手,希望指点。谢谢
 回复 引用 查看   
#34楼[楼主] 2010-03-12 11:48 | Bēniaǒ      
@jflc
.NET是.NET,那肯定是用Visual Studio。
Flex用FlexBuilder撒.......

 回复 引用 查看   
#35楼 2010-05-23 12:02 | alswl      
博主,太厉害了,正在被FMS搞得头疼蛋大
这代码就是 雪中送炭啊~

 回复 引用 查看   
#36楼[楼主] 2010-05-23 19:48 | Bēniaǒ      
@alswl
呵呵,一起学习。

 回复 引用 查看   
#37楼 2010-11-01 08:37 | xljniit      
楼主
新手:忙烦指点一下。Visual Studio 2008里怎么结合你这个源码做到局域网内实时视频聊天。

 回复 引用 查看   
#38楼 2010-11-01 08:38 | xljniit      
运行环境是什么?
 回复 引用 查看   
#39楼[楼主] 2010-11-11 14:59 | Bēniaǒ      
@xljniit
VS2008里面开发 你看我写的《Flex与.NET互操作》系列文章吧。

 回复 引用 查看   
#40楼 2010-11-15 14:09 | emmy      
我也要学 flex与 .net的结合使用的文章!!!
谢谢楼主共享!!!

 回复 引用 查看   
发表评论

昵称: [登录] [注册]

主页:

邮箱:(仅博主可见)

评论内容:

  登录  注册

[使用Ctrl+Enter键快速提交评论]

0 1444159 ShapuqZmxDw=
微软最有价值专家(MVP)

微软技术社区精英(CNTAC)

2010年IT博客大赛50强

微软最有影响力开发者(GDI)


Bing Maps开发一群:75662563
微软技术群-重庆站:97035589
RIA技术联盟QQ群:26917590
昵称:Bēniaǒ
园龄:4年6个月
荣誉:推荐博客
粉丝:408
关注:26

随笔分类(285)

文章分类(14)

积分与排名

  • 积分 - 760858
  • 排名 - 60

最新评论