`
freeroy
  • 浏览: 74573 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

FMS案例开发--视频聊天室(三)【转】

阅读更多

      本文要介绍的内容主要有利用SharedObject来实现聊天文字聊天和在线用户的列表,以及实现语音视频聊天等。

      前一篇文章介绍了实现用户注册和登录的功能,本文接着介绍用户注册并成功登录后的相关功能开发。首先分析下功能,用户登录成功要做四件事:

      1、显示自己的视频到聊天界面(作用不大,自己看而已)

      2、发布自己的视频和语音数据到FMS服务器(这个作用很大,别人则根据你发布的数据查看你的视频等)

      3、将自己的基本信息写如共享对象,实现在线用户列表。

      4、通过共享对象来实现文字聊天(本文只是为了演示方便,实际开发中应尽量使用Client-Server之间的方法调用实现)

      OK,有了上面的分析,接下来一步一步的实现这些功能。显示自己的视频到界面很简单,在以前的相关文章里都有使用到。

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->private function displayCameraSelf():void
{
    
//显示自己的视频
    myCamera = Camera.getCamera();
    
if(myCamera != null)
    {
        
this.twoVideo.attachCamera(myCamera);
    }
    
else
    {
        Alert.okLabel
="确 定";
        Alert.show(
"没检测到视频摄像头!","系统提示");
    }
}

 

      发布视频数据到FMS很简单,既通过NetConnection和NetStream就可以完成,需要注意的是,在发布视频流的时候视频流的命名规则采用的用户名,也就是用户名是什么,他发布的视频流就叫什么名字,其他用户要查看他的视频就是通过他的用户名命名的流名来查看。

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->private function onLoginRusult(evt:ResultEvent):void
{
    
if(evt.result != null)
    {
        
//显示自己的视频
        displayCameraSelf();
        
        
//连接FMS服务器发布自己的视频流
        publishNc = new NetConnection();
        publishNc.connect(
"rtmp://localhost/ChatRoom");
        publishNc.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
        publishNc.client 
= this;
        
        playNc 
= new NetConnection();
        playNc.connect(
"rtmp://localhost/ChatRoom");
        playNc.addEventListener(NetStatusEvent.NET_STATUS,onPlayStatusHandler);
        playNc.client 
= this;
        
        so 
= SharedObject.getRemote("ChatSO",publishNc.uri,false);
        so.addEventListener(SyncEvent.SYNC,onSyncHandler);    
        so.connect(publishNc);        
        so.client 
= this;                
        
        userSO 
= SharedObject.getRemote("UserSO",publishNc.uri,false);
        userSO.connect(publishNc);
        userSO.client 
= this;
        
        
        UserName 
= myUserName = evt.result.UserName;
        NickName 
= myNickName = evt.result.NickName;
        
        
//将当前用户添加到共享对象
        var uarray:ArrayCollection;
        var o:Object 
= new Object();
        o.UserName
=myUserName;
        o.NickName
=myNickName;
        
        
if(userSO.data.UserList == null)
        {
            uarray 
= new ArrayCollection();
        }
        
else
        {
            uarray 
= userSO.data.UserList as ArrayCollection;
    
        }
        var temp:ArrayCollection 
= new ArrayCollection();
        convertArrayCollection(temp,uarray);
        temp.addItem(o);
        userSO.setProperty(
"UserList",temp);
    
        
this.loginPanel.visible = false;
        
this.chatRoomPanel.visible=true;
        ChatRoomViewStack.selectedChild 
= chatRoomPanel;
    }
    
else
    {
        Alert.okLabel
="确 定";
        Alert.show(
"登录失败!","系统提示");
    }
}

private function onNetStatusHandler(evt:NetStatusEvent):void
{
    
if(evt.info.code == "NetConnection.Connect.Success")
    {
        
//连接成功则发布自己的流到FMS
        publishNs = new NetStream(publishNc);
        publishNs.attachAudio(myMic);
        publishNs.attachCamera(myCamera);
        publishNs.client
=this;
        
//以用户名作为视频流名,直接通过用户名连接对方的流
        publishNs.publish(myUserName,"live");    
    }
}

 

      默认自己和自己对聊,只有从在线用户列表里选择了用户才和对应的人进行视频聊天,也就是说初始化为自己连接到自己的视频流。实现代码如下所示:

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->private function onPlayStatusHandler(evt:NetStatusEvent):void
{
    
if(evt.info.code == "NetConnection.Connect.Success")
    {
        playNs 
= new NetStream(playNc);
        var v:Video 
= new Video();
        v.width 
= 320;
        v.height
= 240;
        v.attachNetStream(playNs);
        playNs.play(UserName,
"live");
        
this.oneVideo.addChild(v);
    }
}

      连接到自己发布的视频流,将视频流显示到界面上。

      文字聊天使用的共享对象做的大厅聊天,实现很简单,关于共享对象实现文字聊天详细可以查看《使用远程共享对象(SharedObject)实现多人时时在线聊天(Flex | Flash) 》。

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->/**
 * 发送聊天消息
 * 
*/
private function sendMessage(evt:MouseEvent):void
{
    var tempCollection:ArrayCollection 
= new ArrayCollection();
    
if(so.data.msgCollection != null)
    {
        convertArrayCollection(tempCollection,so.data.msgCollection 
as ArrayCollection);
    }
    var msg:Message 
= new Message();
    msg.NickName 
= myNickName;
    msg.Context 
= this.txtMessage.text;
    tempCollection.addItem(msg);
    
    
//更新远程共享对象中的属性值
    so.setProperty("msgCollection",tempCollection);
    
    
this.txtMessage.text="";
}

private function onSyncHandler(evt:SyncEvent):void
{
    
if(so.data.msgCollection != null)
    {
        
//首次登录进来异步获取消息的时候不显示登录之前的消息
        if(isFirstLogin)
        {
            so.setProperty(
"msgCollection",null);
            isFirstLogin 
= false;
        }
        
else
        {
            var tempCollection:ArrayCollection 
= new ArrayCollection();
            convertArrayCollection(tempCollection,so.data.msgCollection 
as ArrayCollection);
            
            
this.displayMessage.text="";
            
for(var index:int=0;index<tempCollection.length;index++)
            {
                var message:Object 
= tempCollection.getItemAt(index);
                var displayMessage:String 
= message.NickName+"说:"+message.Context;
                
this.displayMessage.text += displayMessage + "\n";
            }
        }
    }
    
this.displayMessage.verticalScrollPosition=this.displayMessage.maxVerticalScrollPosition;
}

 

      前面用户登录的时候已经将用户信息写入了共享对象,用户在线列表只需要将共享对象的数据读出来,显示在界面上就OK,这里使用tree控件来呈现数据。

 

<!--<br /><br />Code highlighting produced by Actipro CodeHighlighter (freeware)<br />http://www.CodeHighlighter.com/<br /><br />-->private function init():void
{
    nc 
= new NetConnection();
    nc.connect(
"rtmp://localhost/ChatRoom");
    nc.addEventListener(NetStatusEvent.NET_STATUS,onNetStatusHandler);
    nc.client 
= this;
    
    so 
= SharedObject.getRemote("UserSO");
    so.addEventListener(SyncEvent.SYNC,onSyncHandler);
    so.connect(nc);
    so.client 
= this;
}

private function onNetStatusHandler(event:NetStatusEvent):void
{
    
if(event.info.code=="NetConnection.Connect.Success")
    {
        
if(so.data.UserList!=null)
        {
            var uarray:Array 
= so.data.UserList as Array;
            
this.userTree.dataProvider = uarray;
        }
    }
}

private function onSyncHandler(event:SyncEvent):void
{
    
if(so.data.UserList!=null)
    {
        var uarray:Array 
= so.data.UserList as Array;
        
this.userTree.dataProvider = uarray;
    }
}

 

 

分享到:
评论

相关推荐

    FMS聊天室下载FMS

    5. **FMS聊天室应用案例** - **在线教育**:实时的课堂互动,教师与学生间的音视频交流。 - **企业协作**:远程会议、团队讨论,提高工作效率。 - **娱乐直播**:游戏直播、音乐会、体育赛事等,观众与主播互动。...

    FMS案例开发.pdf

    在本案例中,我们主要探讨的是如何利用Adobe的FMS(Flash Media Server)技术来开发一个视频聊天室。FMS是Adobe提供的一款强大的流媒体服务器,它支持实时的音频、视频传输,以及数据共享,非常适合用于构建交互性强...

    FMS案例开发[整理].pdf

    在本FMS案例开发中,我们探讨了一个基于Adobe Flash Media Server 3 (FMS)的视频聊天室的构建过程。这个项目旨在满足日益增长的实时交互式互联网应用需求,特别是那些涉及视频通信的场景,如视频聊天、视频会议和...

    as3 + fms3聊天室

    【标题】"AS3 + FMS3聊天室"是一个基于ActionScript 3(AS3)编程语言和Flash Media Server 3(FMS3)技术构建的在线聊天室应用。这个项目提供了一个简单但实用的平台,让多个用户可以实时交流分享信息。 【描述】...

    FMS程序开发 (笔记+程序+资料)

    3. **源码**:完整的聊天室应用源码,可能用到了实时通信技术,如WebSocket,用于FMS系统的远程监控和交互。 资料部分可能涵盖: 1. **教程**:详细的教学材料,引导读者从基础到进阶地学习FMS编程。 2. **案例研究...

    fms3中文教程(汇总)

    5. 5.doc - 实例解析,通过实际案例学习如何使用FMS3开发应用。 6. 6.doc - 高级话题,探讨更复杂的技术实现和优化技巧。 7. 7.doc - 常见问题与解决方案,解决学习和使用过程中遇到的问题。 通过这个详细的教程,...

    FMS3中文帮助文档

    4. **互动性**: FMS3支持实时交互功能,如聊天室、投票、游戏等,增强了用户参与度和沉浸感。 5. **可扩展性**: 开放的API接口使得开发者可以自定义功能,实现更复杂的应用场景,如数据分析、用户行为跟踪等。 6. ...

    apache-activemq-5.1.0-bin fms

    在本案例中,我们讨论的是ActiveMQ的5.1.0版本,这在当时是一个较新的版本,特别适合于Flex应用程序中的即时消息传递需求,如构建聊天室等功能。 Java消息服务(JMS)是Java平台上的一个标准API,用于在分布式环境...

    一步一步学Flash Media Server

    #### 三、实践案例 —— 聊天室 接下来,我们将通过构建一个简单的聊天室应用来实际演示如何使用 FMS。 1. **准备环境**: 确保 FMS 已正确安装并配置好。 2. **创建项目**: 在 `applications` 目录下新建项目...

    flex java red5完全学习手册

    1. **编写服务器端代码**:使用Java编写简单的Red5服务器端逻辑,例如实现一个简单的聊天室功能。 2. **编写客户端代码**:使用Flex开发客户端界面,实现与服务器端的数据交互。 3. **运行程序**:启动Red5服务器...

    Video2.zip_ICQ/即时通讯_Flex_

    6. **视频聊天室实现**:视频聊天室需要处理多用户间的视频流同步、带宽管理、音视频编码解码等问题,对服务器性能和网络条件有较高要求。 7. **客户端与服务器通信**:使用Flex和FMS,客户端和服务器之间的通信可能...

Global site tag (gtag.js) - Google Analytics