聊天室发图片和发表情设计思路

1.聊天室发图片

用户选择好图片后点击发送按钮，首先是调用后台提供的图片上传接口；

该接口先将需要发送的图片保存到服务器，保存成功后服务器返回一个图片地址给前台；

前台拿到这个地址后再将这个地址发送出去；

目标用户收到这个地址后就可以获取这个图片。

如果客户端是Web形式的，那么可以使用ajaxFileUpload这个jQuery插件，来实现异步的方式调用接口保存图片，获得后台返回的地址后再将图片地址发送出去。

ajaxFileUpload参考资料：http://www.mashangpiao.net/Article/Index/145

 

2.聊天室发表情

用户点击发送含有表情的消息其实发送的只是表情代号，目标用户接受这些代号之后就将他们解释成对应的表情图片

比如下面这段代码：

var reg = /\[\/([^\]]+)\/\]/g;
var say = "aabbbbcc[/i_f01/][/i_f02/]dddd[/i_f03/]ee";
say = say.replace(reg, "<img src='./face/$1.gif' />");

say中的[/i_f01/]就是自定义表情代号，其中i_f01是表情文件名，使用正则替换的方式就可以将消息中的表情代号替换成图片