一个简单的聊天室
服务端:
开发工具:
eclipse3.6+jdk1.6
客户端:
开发工具:Flash Builder4
目的:做一个简单的聊天室,用来实现消息广播。
服务端代码(Server.java)
客户端代码:FlexClient.mxml
- <?xml version="1.0" encoding="utf-8"?>
- <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
- xmlns:s="library://ns.adobe.com/flex/spark"
- xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600" creationComplete="initApp()">
- <fx:Declarations>
- <!-- 将非可视元素(例如服务、值对象)放在此处 -->
- </fx:Declarations>
-
- <fx:Script>
- <![CDATA[
-
- import flash.net.Socket;
- import flash.utils.ByteArray; //ByteArray在读取数据时使用
- private var socket:Socket=new Socket(); //定义socket
-
- internal function initApp():void
- {
- socket.connect("127.0.0.1",8888); //执行连接
- //监听连接成功事件
- socket.addEventListener(Event.CONNECT,funConnect);
- //监听关闭事件
- socket.addEventListener(Event.CLOSE,funClose);
- //监听服务器新消息
- socket.addEventListener(ProgressEvent.SOCKET_DATA,funSocket);
- }
-
-
- internal function funConnect(event:Event):void{
- myText.text="连接已建立...";
-
- }
-
- internal function funClose(event:Event):void{
- myText.text="连接已关闭...";
- }
-
-
- internal function sendMessage(msg:String):void{ //发送数据到服务器
- //新建一个ByteArray来存放数据
- var message: ByteArray=new ByteArray();
- //写入数据,使用writeUTFBytes以utf8格式传数据,避免中文乱码
- message.writeUTFBytes(msg+"n");
- //写入socket的缓冲区
- socket.writeBytes(message);
- //调用flush方法发送信息
- socket.flush();
- //清空消息框
- myInput.text="";
-
- }
- //接受服务器信息
- internal function funSocket(event:ProgressEvent):void{
- var msg:String="";
- //循环读取数据,socket的bytesAvailable对象存放了服务器传来的所有数据
- while(socket.bytesAvailable)
- {
- //强制使用utf8格式,避免中文乱码
- msg+=socket.readMultiByte(socket.bytesAvailable,"utf8");
- //使用n换行符号把信息切开
- var arr:Array=msg.split('n');
-
- for(var i:int=0;i<arr.length;i++){
- //正则表达式,回车符
- var myPattern:RegExp=/r/;
- //删除回车符
- arr[i]=arr[i].replace(myPattern,'');
- //在聊天框中输出
- myText.text+=arr[i]+'n';
- }
-
- }
- myText.verticalScrollPosition=myText.maxVerticalScrollPosition; //滚动到最下面
- }
-
- ]]>
- </fx:Script>
- <mx:TextArea x="10" y="48" width="334" height="250" id="myText"/>
- <s:TextInput x="10" y="18" width="334" id="myName" text="名字"/>
- <s:TextInput x="10" y="297" width="261" height="20" id="myInput"/>
- <s:Button x="270" y="296" label="发送" width="74" id="myBtn" click="sendMessage(myName.text+':'+myInput.text)"/>
- </s:Application>
参考资料
http://www.114study.com/template/datum/datumdetail.aspx?ddid=422060
|