[原创]简易版Socket聊天室 附源码
2009-05-25 00:16
357 查看
这是继扫雷之后的另一个C#习作,实现了一个带表情的聊天室。个人认为主要的工作量分别在于:异步Socket、XML序列化、设计简单的通讯协议以及如何实现带表情的对话框这四部分。这里先介绍一个基本结构,希望能抛砖引玉。
先上截图:
[b]1. 程序结构[/b]
我的程序分为三个主要部件,分别在三个工程里实现:Client,Server,Common
其中,Client和Server主要是GUI和业务逻辑的实现。Common工程里封装了Client和Server都需要的Socket通讯模块,基中SocketHandler.cs是在Socket上进一步封装,为上层应用隐去了异步Socket传输的细节,同时根据协议把Socket传输的Byte流转换成对象后传递给上层应用。
SocketHandler提供的接口有:
a) Socket Connect(string ipAddress) Client端使用
b) Socket Listen() Server端使用
c) void SendPacket(Socket s, DataPacket data) Client和Server之间传输消息的接口,注:DataPacket是在Common>ChatCommand.cs里定义的对象
d) void BroadCastPacket(DataPacket data) Server端通过该接口给所有连接的Client广播数据包
初始化SocketHander的代码(见Form1.cs)
SocketHandler handler = new SocketHandler();
handler.OnDataArrive += OnDataArrive;
OnDataArrive是处理收到数据后业务逻辑的EventHandler:
void OnDataArrive(DataPacket data, Socket s)
如此,Server端和Client端的区别仅仅在于OnDataArrive事件触发后实现不同的逻辑,以及在初始化时,分别调用SocketHandler中的Connect/Listen接口。
[b]2. 通讯协议
[/b]
通讯协议的接口主要在Common.ChatCommand.cs中实现。传输的数据是XmlSerializable的DataPacket Class。
CommandCode指示了DataPacket里包含的是哪一种类型的数据:
public enum CommandCode
{
None, (无意义,仅在初始化时使用)
SendMessage, (传输聊天数据,当CommandCode为SendMessage时,DataPacket中将包含message,time,sender这三个field)
BroadCastMessage, (无数据,该消息用来通知所有Client新的聊天数据已经到达,Client须调用PollMessage来获取聊天数据)
PollMessage, (包含LastRetrievedMessageTime,Server端在收到该消息后,会将在LastRetrievedMessageTime之后的一条消息传递给Client端)
}
基本的通讯流程如下:
1. 当ClientA发送消息时,他会发送一个含SendMessage的DataPacket到Server。
2. Server收到SendMessage的消息后,会将该消息存到本地的聊天记录中,然后广播BoradCastMessage给所有的客户端。这里并不直接发送聊天数据,可以由Client来选择正确的时机来读取数据。
3. 当ClientA,B...N收到BroadCastMessage时,得知有新消息到达,发送PollMessage到Server,获取消息。
4. Server收到PollMessage类型的DataPacket后,根据LastRetrievedMessageTime找到Client所需要的消息,发送SendMessage类型的DataPacket到Client
5. 当Client收到SendMessage后,SocketHandler会调用OnDataArrive事件,Client在界面上显示该消息。
3. 关于界面的实现
界面实现的时候有两个难点,一是如果把GIF的表情放到textBox中,另一个是要实现一个类似对话框的给用户选择表情。
这里参照了两篇CodeProject上的文档:
http://www.codeproject.com/KB/edit/csexrichtextbox.aspx?print=true 这篇是关于如果在RichTextBox中插入GIF格式的图片的。注,网上比较容易找到的是通过Paste的方法把图片插入到RichTextBox的代码,但是这样做一会影响原先剪贴板中的内容,二是对GIF格式无效。这篇文档的作者很牛,他的做法是直接把图片转换成RTF格式然后插入到RichTextBox里。只不过实现起来太麻烦了,所以我直接引用了他的控件 ^^
http://www.codeproject.com/KB/miscctrl/simplepopup.aspx 这篇文档介绍了怎么做弹出效果。我自己写了一个Panel的控件在ChatClient.EmotionPanel.cs里
最后附上源代码:
ChatRoom.rar
Edit: 忘记上传表情包了:Face2.rar。解压放到c:\face2下面去后就能运行了。我承认我丑陋了,怎么也该写一个post build script啊。
先上截图:
[b]1. 程序结构[/b]
我的程序分为三个主要部件,分别在三个工程里实现:Client,Server,Common
其中,Client和Server主要是GUI和业务逻辑的实现。Common工程里封装了Client和Server都需要的Socket通讯模块,基中SocketHandler.cs是在Socket上进一步封装,为上层应用隐去了异步Socket传输的细节,同时根据协议把Socket传输的Byte流转换成对象后传递给上层应用。
SocketHandler提供的接口有:
a) Socket Connect(string ipAddress) Client端使用
b) Socket Listen() Server端使用
c) void SendPacket(Socket s, DataPacket data) Client和Server之间传输消息的接口,注:DataPacket是在Common>ChatCommand.cs里定义的对象
d) void BroadCastPacket(DataPacket data) Server端通过该接口给所有连接的Client广播数据包
初始化SocketHander的代码(见Form1.cs)
SocketHandler handler = new SocketHandler();
handler.OnDataArrive += OnDataArrive;
OnDataArrive是处理收到数据后业务逻辑的EventHandler:
void OnDataArrive(DataPacket data, Socket s)
如此,Server端和Client端的区别仅仅在于OnDataArrive事件触发后实现不同的逻辑,以及在初始化时,分别调用SocketHandler中的Connect/Listen接口。
[b]2. 通讯协议
[/b]
通讯协议的接口主要在Common.ChatCommand.cs中实现。传输的数据是XmlSerializable的DataPacket Class。
CommandCode指示了DataPacket里包含的是哪一种类型的数据:
public enum CommandCode
{
None, (无意义,仅在初始化时使用)
SendMessage, (传输聊天数据,当CommandCode为SendMessage时,DataPacket中将包含message,time,sender这三个field)
BroadCastMessage, (无数据,该消息用来通知所有Client新的聊天数据已经到达,Client须调用PollMessage来获取聊天数据)
PollMessage, (包含LastRetrievedMessageTime,Server端在收到该消息后,会将在LastRetrievedMessageTime之后的一条消息传递给Client端)
}
基本的通讯流程如下:
1. 当ClientA发送消息时,他会发送一个含SendMessage的DataPacket到Server。
2. Server收到SendMessage的消息后,会将该消息存到本地的聊天记录中,然后广播BoradCastMessage给所有的客户端。这里并不直接发送聊天数据,可以由Client来选择正确的时机来读取数据。
3. 当ClientA,B...N收到BroadCastMessage时,得知有新消息到达,发送PollMessage到Server,获取消息。
4. Server收到PollMessage类型的DataPacket后,根据LastRetrievedMessageTime找到Client所需要的消息,发送SendMessage类型的DataPacket到Client
5. 当Client收到SendMessage后,SocketHandler会调用OnDataArrive事件,Client在界面上显示该消息。
3. 关于界面的实现
界面实现的时候有两个难点,一是如果把GIF的表情放到textBox中,另一个是要实现一个类似对话框的给用户选择表情。
这里参照了两篇CodeProject上的文档:
http://www.codeproject.com/KB/edit/csexrichtextbox.aspx?print=true 这篇是关于如果在RichTextBox中插入GIF格式的图片的。注,网上比较容易找到的是通过Paste的方法把图片插入到RichTextBox的代码,但是这样做一会影响原先剪贴板中的内容,二是对GIF格式无效。这篇文档的作者很牛,他的做法是直接把图片转换成RTF格式然后插入到RichTextBox里。只不过实现起来太麻烦了,所以我直接引用了他的控件 ^^
http://www.codeproject.com/KB/miscctrl/simplepopup.aspx 这篇文档介绍了怎么做弹出效果。我自己写了一个Panel的控件在ChatClient.EmotionPanel.cs里
最后附上源代码:
ChatRoom.rar
Edit: 忘记上传表情包了:Face2.rar。解压放到c:\face2下面去后就能运行了。我承认我丑陋了,怎么也该写一个post build script啊。
相关文章推荐
- 基于多线程和SOCKET的聊天室(原创附源码)【没有控件的ASP.NET】
- 基于多线程和SOCKET的聊天室(原创附源码)【没有控件的ASP.NET】
- 基于多线程和SOCKET的聊天室(原创附源码)【没有控件的ASP.NET】
- C#简易版Socket聊天室 附源码
- node.js+socket.io+聊天室源码
- [XMPP]简易的聊天室实现[二](使用CocoaAsyncSocket)
- 基于Linux C 用socket和线程 实现的简易聊天室之客户端
- 【Android學習專題】網絡通信篇:Socket TCP(简易聊天室)
- 【Android學習專題】網絡通信篇:Socket TCP(简易聊天室)
- android网络编程 -- Socket 通信(03) 点对点Android聊天室实现(带服务器) [附源码分析]
- Java简易聊天室程序socket
- 一个基于Socket协议的手机聊天室源码
- Android学习笔记(31) --- 网络通信之Socket简易聊天室
- 一个基于Socket协议的手机聊天室源码
- 一个基于Socket协议的手机聊天室源码
- 服务器推送技术--spring websocket + 心跳保活重连 简易聊天室demo(一)
- 14级团队学习成果汇报 -- 利用express+socket.io搭建简易版聊天室
- 示例:Socket应用之简易聊天室
- Node.js+Socket.IO实现的WebSocket群聊天室源码
- nodejs学习笔记(3)-socket.io打造简易聊天室