Flex,如何在所有连接的用户之间交换用户名和对等ID

时间:2012-02-13 15:57:27

标签: flex datagrid stream chat p2p

您好我正在使用Flex构建聊天。问题是如何让新用户在线获取所有用户的列表并添加到所有用户的列表中。我尝试通过dataProvider“callerns”将此信息放在DataGrid中:

<s:DataGrid x="10" y="125" width="238" height="125" alternatingRowColors="[ #67676767, #555555]"
            borderVisible="true" chromeColor="#555555" color="#CCCCCC"
            contentBackgroundColor="#555555" dataProvider="{callerns}" fontWeight="bold"
            requestedRowCount="4" rollOverColor="#08700D" selectionColor="#08700D"
            symbolColor="#CCCCCC">
    <s:columns>
        <s:ArrayList>
            <s:GridColumn dataField="name" headerText="USER ONLINE"></s:GridColumn>
            <s:GridColumn dataField="peerID" headerText="USER ID"></s:GridColumn>
        </s:ArrayList>
    </s:columns>
</s:DataGrid>

以下是代码的一部分:

 [Bindable]
  private var callerns:ArrayCollection = new ArrayCollection();

...........

private function netStatusEvent(event:NetStatusEvent):void{

            trace('NetConnection status event (1): ' + event.info.code);

            //writeText(event.info.code);

            switch(event.info.code){
                case "NetConnection.Connect.Success":
                    log('Connected (NearID: '+nc.nearID+')', 'debug');
                    log('Connection sucsessful');

                    MyPeerID = nc.nearID;
                    txtFingerprint.text = MyPeerID;
                    initSendNetStream();
                    callerns.addItem({peerID: MyPeerID, name: myName});
                    setupGroup();                       
                    break;

                case "NetGroup.Posting.Notify":
                    receiveMessage(event.info.message);
                    log('Message posted');
                    break;

                case "NetGroup.Connect.Success":
                    log('Net Group connection sucsessful');
                    connected = true;
                    break;

                case 'NetStream.Connect.Success':
                    log('Peer Connected (FarID: '+event.info.stream.farID+')', 'debug');
                    break;

                case "NetGroup.Neighbor.Connect":
                    log('New user connected');
                    break;

            }

        }  

private function initSendNetStream():void{
            trace("initSendStream");

            sendStream = new NetStream(nc,NetStream.DIRECT_CONNECTIONS);
            sendStream.addEventListener(NetStatusEvent.NET_STATUS, netStatusEvent);
            var clientObject:Object = new Object();
            clientObject.onPeerConnect = function(callerns:NetStream):Boolean{

                initRecvStream(callerns.farID);
                callerns.send('onPeerNameUpdate', MyPeerID, myName);

                return true;
            }

            sendStream.client = clientObject;
            sendStream.publish('video');
            log('Net Stream publish start');

        }   

        private function initRecvStream(peerID:String):void {
            //log('initRecvStream', 'debug');

            var stream:NetStream = new NetStream(nc, peerID);
            stream.addEventListener(NetStatusEvent.NET_STATUS, netStatusEvent);
            stream.play('video');

            var client:Object = new Object();
            client.onPeerNameUpdate = onPeerNameUpdate;

            stream.client = client;

            var peer:Object = new Object();
            peer.stream = stream;

            recvStreams[peerID] = peer;
        }

        private function onPeerNameUpdate(peerID:String, name:String):void {
            //log('onPeerNameUpdate received: '+peerID+':'+name, 'debug');
            //log(name+' connected to your channel', 'debug');
            callerns.addItem({peerID: peerID, name: name});
        }

不幸的是,这不起作用,新用户也没有添加到网格中。你能帮我解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

删除原帖似乎我错了,这有效:

<?xml version="1.0" encoding="utf-8"?>
<s:Group creationComplete="group1_creationCompleteHandler(event)"
         height="100%"
         width="100%"
         xmlns:fx="http://ns.adobe.com/mxml/2009"
         xmlns:mx="library://ns.adobe.com/flex/mx"
         xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            import mx.collections.ArrayCollection;
            import mx.events.FlexEvent;

            [Bindable]
            private var callerns : ArrayCollection;

            protected function group1_creationCompleteHandler(event : FlexEvent) : void
            {
                callerns = new ArrayCollection();
            }

            protected function addItemClickHandler(event : MouseEvent) : void
            {
                callerns.addItem({peerID: "somePeerID", name: "someName"});
            }
        ]]>
    </fx:Script>
    <s:layout>
        <s:VerticalLayout/>
    </s:layout>
    <s:Button click="addItemClickHandler(event)"
              label="Add Item"/>
    <s:Button click="propertyChangeClickHandler(event)"
              label="Dispatch Property Change"/>
    <s:DataGrid alternatingRowColors="[ #67676767, #555555]"
                borderVisible="true"
                chromeColor="#555555"
                color="#CCCCCC"
                contentBackgroundColor="#555555"
                dataProvider="{callerns}"
                fontWeight="bold"
                height="125"
                requestedRowCount="4"
                rollOverColor="#08700D"
                selectionColor="#08700D"
                symbolColor="#CCCCCC"
                width="238"
                x="10"
                y="125">
        <s:columns>
            <s:ArrayList>
                <s:GridColumn dataField="name"
                              headerText="USER ONLINE">
                </s:GridColumn>
                <s:GridColumn dataField="peerID"
                              headerText="USER ID">
                </s:GridColumn>
            </s:ArrayList>
        </s:columns>
    </s:DataGrid>
</s:Group>

所以我本来是错的,按下按钮会导致网格更新。如果你发布了一个你正在构建的原始教程的链接,那将是非常有帮助的,我发现它并且使用spark就好了。我假设你已经弄清楚了这部分,但这里是基本的聊天客户端:

<?xml version="1.0" encoding="utf-8"?>
<s:Application minHeight="600"
               minWidth="955"
               xmlns:fx="http://ns.adobe.com/mxml/2009"
               xmlns:mx="library://ns.adobe.com/flex/mx"
               xmlns:s="library://ns.adobe.com/flex/spark">
    <fx:Declarations>
        <!-- Place non-visual elements (e.g., services, value objects) here -->
    </fx:Declarations>
    <fx:Script>
        <![CDATA[
            private const SERVER_ADDRESS : String = "rtmfp://p2p.rtmfp.net/";
            private const DEVELOPER_KEY: String = PUT_YOUR_DEV_KEY_HERE;

            private var nc : NetConnection;
            private var myPeerID : String;
            private var farPeerID : String;
            // streams
            private var sendStream : NetStream;
            private var recvStream : NetStream;

            private function initConnection() : void
            {
                if (txtFingerprint.text)
                {
                    farPeerID = txtFingerprint.text;
                }

                nc = new NetConnection();
                nc.addEventListener(NetStatusEvent.NET_STATUS, ncStatus);
                nc.connect(SERVER_ADDRESS + DEVELOPER_KEY);
            }

            private function ncStatus(event : NetStatusEvent) : void
            {
                trace(event.info.code);

                myPeerID = nc.nearID;

                txtFingerprint.text = myPeerID;
            }

            private function initSendStream() : void
            {
                trace("initSendStream");

                sendStream = new NetStream(nc, NetStream.DIRECT_CONNECTIONS);
                sendStream.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
                sendStream.publish("media");

                var sendStreamClient : Object = new Object();
                sendStreamClient.onPeerConnect = function(callerns : NetStream) : Boolean
                {

                    farPeerID = callerns.farID;

                    trace("onPeerConnect " + farPeerID);

                    return true;
                }

                sendStream.client = sendStreamClient;

            }

            private function initRecvStream() : void
            {
                recvStream = new NetStream(nc, farPeerID);
                recvStream.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
                recvStream.play("media");

                recvStream.client = this;
            }

            public function receiveSomeData(str : String) : void
            {
                txtReceiveData.text = str;
            }

            private function sendSomeData() : void
            {
                sendStream.send("receiveSomeData", txtSendData.text);
            }

            private function netStatusHandler(event : NetStatusEvent) : void
            {
                trace(event.info.code);
            }
        ]]>
    </fx:Script>
    <mx:TextInput id="txtFingerprint"
                  width="391"
                  x="10"
                  y="10"/>
    <mx:Button click="initConnection()"
               label="Connect"
               x="409"
               y="10"/>
    <mx:TextInput id="txtSendData"
                  x="10"
                  y="40"/>
    <mx:TextInput id="txtReceiveData"
                  width="251"
                  x="10"
                  y="70"/>
    <mx:Button click="sendSomeData()"
               label="Send data"
               x="178"
               y="40"/>
    <mx:Button click="initSendStream()"
               label="initSendStream"
               x="10"
               y="100"/>
    <mx:Button click="initRecvStream();"
               label="initReceiveStream"
               x="132"
               y="100"/>
    <mx:Text height="122"
             text="Hint: First running Flash app - click Connect to get Fingerprint PeerID. Copy and paste this PeerID to second running Flash app to the same field and click Connect. Then initSendStream and initReceiveStream on both of them and finally you can write some text and click Send data."
             width="391"
             x="10"
             y="130"/>

</s:Application>

在此处获取开发人员密钥:

http://www.adobe.com/cfusion/entitlement/index.cfm?e=cirrus

我不确定会出现什么问题,但正如上面的评论者所说,你需要包括它究竟是如何打破的,这就是调试时会发生的事情(确保为你使用的任何浏览器安装调试flash播放器,请注意chrome默认情况下管理它自己的插件)你在控制台看到了什么,你得到任何错误等。教程应用程序适用于我,有这种处理双向通信和维护所有连接的同行的列表似乎是目标正确?我也不明白有关NetGroup的问题,但是在P2P上有更多关于这一点的内容:

http://www.adobe.com/devnet/flashmediaserver/articles/p2p_rtmfp_groups.html

我希望你能够提供更多关于你的起点以及你所处的地方的信息(以及代码,我总是想要更多的代码:)