Top
简易的聊天工具
1.1 问题
Socket的英文原义是孔或者插座的意思,通常也称作套接字,用于描述IP地址和端口,是一个通信链的句柄,本案例使用第三方Socket编程框架AsyncSocket框架实现一个简易的聊天工具,并且能够进行文件传输,由于没有服务器本案例将服务器端和客户端写在一个程序中,如图-1所示:
![](http://tts8.tmooc.cn/ttsPage/VIP/VIP_ISD_A_ALL/NETWORKING/DAY01/CASE/01/index.files/image001.png)
图-1
1.2 方案
首先创建一个SingleViewApplication应用,导入AsyncSocket框架。在Storyboard中搭建聊天界面,上方的Textfield控件用于输入接受端IP地址,中间TextView控件用于展示聊天记录,下方的TextView用于接受用户输入的聊天内容,右下角有一个发送按钮。将这三个控件分别关联成ViewController的输出口属性IPTF、chatRecordTV、chatTV。
接下来首先实现聊天功能,在ViewController中定义三个属性severSocket、clientSocket以及myNewSocket。在viewDidLoad方法中创建服务器端severSocket,将端口号设置为8000,委托对象设置为self。将发送按钮关联成viewController的动作方法send:,实现send:方法,创建客户端对象,获取聊天输入框的内容转化成NSData类型的数据发送出去。
然后ViewController遵守AsyncSocketDelegate协议,分别实现关于socket连接,数据传输以及数据读取的协议方法,更新显示聊天记录内容。
最后实现传输文件功能,传输文件时为了确定所传输文件的类型需要拼接一个消息头,将传输文件的类型、名称和大小保存到消息头里,通常传输数据的开始的100个字节是消息头。在sender:方法中增加拼接消息头的代码。
接受端在接收到文件数据时首先对消息头进行解析,获取到接收文件的类型、大小以及名称,然后再持续接受文件数据,接受完成后将文件保存到本地路径。
1.3 步骤
实现此案例需要按照如下步骤进行。
步骤一:搭建聊天界面
首先创建一个SingleViewApplication应用,导入AsyncSocket框架。在Storyboard中搭建聊天界面,上方的Textfield控件用于输入接受端IP地址,中间TextView控件用于展示聊天记录,下方的TextView用于接受用户输入的聊天内容,如图-2所示:
![](http://tts8.tmooc.cn/ttsPage/VIP/VIP_ISD_A_ALL/NETWORKING/DAY01/CASE/01/index.files/image002.png)
图-2
然后将这三个控件分别关联成ViewController的输出口属性IPTF、chatRecordTV、chatTV,代码如下所示:
- @interface ViewController ()
- @property (weak, nonatomic) IBOutlet UITextField *IPTF;
- @property (weak, nonatomic) IBOutlet UITextView *chatRecordTV;
- @property (weak, nonatomic) IBOutlet UITextView *chatTV;
- @end
步骤二:实现聊天功能
首先在ViewController中定义三个属性severSocket、clientSocket以及myNewSocket,代码如下所示:
- @interface ViewController ()
- @property (nonatomic, strong)AsyncSocket *serverSocket;
- @property (nonatomic, strong)AsyncSocket *clientSocket;
- @property (nonatomic, strong)AsyncSocket *myNewSocket;
- @end
其次在viewDidLoad方法中创建服务器端severSocket,将端口号设置为8000,委托对象设置为self,代码如下所示:
- - (void)viewDidLoad {
- [super viewDidLoad];
- self.serverSocket = [[AsyncSocket alloc]initWithDelegate:self];
- [self.serverSocket acceptOnPort:8000 error:nil];
- }
将发送按钮关联成viewController的动作方法send:,实现send:方法,创建客户端对象,获取聊天输入框的内容转化成NSData类型的数据发送出去,代码如下所示:
- - (IBAction)send:(UIButton *)sender {
- [self.chatTV resignFirstResponder];
- //创建Socket客户端
- self.clientSocket = [[AsyncSocket alloc]initWithDelegate:self];
- [self.clientSocket connectToHost:self.IPTF.text onPort:8000 withTimeout:-1 error:nil];
- //将聊天输入框的内容转化为NSData
- NSData *data = [self.chatTV.text dataUsingEncoding:NSUTF8StringEncoding];
- //发送数据
- [self.clientSocket writeData:data withTimeout:-1 tag:0];
- self.chatRecordTV.text = [NSString stringWithFormat:@"%@\n我说:%@",self.chatRecordTV.text,self.chatTV.text];
- }
运行程序发现,点击聊天输入框弹出的键盘会挡住聊天输入框,因此需要在接受用户输入的时候屏幕界面上移,viewController遵守UITextFieldDelegate和UITextViewDelegate协议,当进入输入状况的时候屏幕界面上移,代码如下所示:
- -(BOOL)textViewShouldBeginEditing:(UITextView *)textView {
- [UIView beginAnimations:nil context:nil];
- [UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
- [UIView setAnimationDuration:0.2];
- self.view.center = CGPointMake(160, self.view.center.y-200);
- [UIView commitAnimations];
- return YES;
- }
添加一个单击手势。当单击屏幕或者点击发送按钮时键盘收回,屏幕界面恢复正常位置,代码如下所示:
- //点击发送按钮是
- - (IBAction)send:(UIButton *)sender {
- [self.chatTV resignFirstResponder];
- [UIView beginAnimations:nil context:nil];
- [UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
- [UIView setAnimationDuration:0.2];
- self.view.center = CGPointMake(160, point.y);
- [UIView commitAnimations];
- //创建Socket客户端
- self.clientSocket = [[AsyncSocket alloc]initWithDelegate:self];
- [self.clientSocket connectToHost:self.IPTF.text onPort:8000 withTimeout:-1 error:nil];
- //将聊天输入框的内容转化为NSData
- NSData *data = [self.chatTV.text dataUsingEncoding:NSUTF8StringEncoding];
- //发送数据
- [self.clientSocket writeData:data withTimeout:-1 tag:0];
- self.chatRecordTV.text = [NSString stringWithFormat:@"%@\n我说:%@",self.chatRecordTV.text,self.chatTV