文章目录
- 发送消息原理说明
- 发送功能实现
- html部分
- javascript代码
- PHP代码
发送消息原理说明
接下来我们发送聊天的文本信息。点击发送按钮的时候,会自动将文本框里的内容发送出去。过程是我们将信息发送到服务器,服务器再转发给对方。文本框的id为msgcontent。
发送功能实现
html部分
给发送按钮添加一个函数,用来实现发送功能。
<button type="button" class="btn btn-primary" onclick="send_msg()">发送</button>
javascript代码
//下面这些变量都是从控制器的index方法传过来的,聊天过程中会经常用。
var from_id='{$from_id}';
var to_id='{$to_id}';
var from_user_name='{$from_user_name}';
from_user_name='我';
var from_avatar='{$from_avatar}';
var to_user_name='{$to_user_name}';
var to_avatar='{$to_avatar}';
//发送信息
function send_msg(){
var content=$('#msgcontent').val();
if(content==''){
return false;
}
/*
*to_id 对方的id
*content 发送的内容,从文本框获取
*type 发送的消息的类型,1表示文本,2表示图片,3表情
*/
$.post('/chat.php/Chat/send', {"to_id":to_id,"content":content,"type":1}, function(data){}, 'json');
var html=render_from(content,1);
$('#chat_content').append(html);
$('#msgcontent').val('');
}
//将自己发送的内容渲染到聊天区域,根据类型不同,渲染不同的效果。
function render_from(content,content_type){
var html='<div class="media_right">' +
' <div class="media-body">' +
' <h4 class="media-heading">'+from_user_name+'</h4>' ;
if(content_type==1){
html+=' <p class="chat_msg_right">'+content+'</p>' ;
}
if(content_type==2 ){
html+=' <p class="chat_msg_right"><img src="'+content+'"/></p>' ;
}
if(content_type==3 ){
html+=' <p class="chat_msg_right"><img src="'+content+'" class="emoj_w"/></p>' ;
}
html+=
' </div>' +
' <div class="media-right">' +
' <img class="media-object avatar" src="'+from_avatar+'" alt="...">' +
' </div>' +
' </div>'
return html;
}
PHP代码
在ChatController.php里添加下面方法
public function send(){
//注册Gateway,必须有
Gateway::$registerAddress = '127.0.0.1:1238';
$type=I('type/d',0);
$to_id=I('to_id/d',0);
$from_id=$_SESSION['user_id'];
$message=I('content/s','');
$db_data=$data=[
'type'=>'text',
'content'=>$message,
'from_id'=>$from_id,
'to_id'=>$to_id,
'content_type'=>$type
];
//将聊天内容写入数据库
$from_user_name=$this->table('user')->where("id={$from_id}")->value('user_name');
$to_user_name=$this->table('user')->where("id={$to_id}")->value('user_name');
$t=time();
$db_data['from_user_name']=$from_user_name;
$db_data['to_user_name']=$to_user_name;
$db_data['add_time']=$t;
$db_data['add_time_f']=format_time($t); //格式化时间
unset($db_data['type']);
$chat_id=$this->table('chat')->add($db_data);
//判断接收方是否在线,在线发送,不在线不用发送给对方
if(Gateway::isUidOnline($to_id)){
$data['chat_id']=$chat_id;
$data['from_user_name']=$from_user_name;
$data['to_user_name']=$to_user_name;
$data['from_id']=$from_id;
$data['to_id']=$to_id;
$message=json_encode($data);
// 向uid的网站页面发送数据
Gateway::sendToUid($to_id, $message);
}
//返回给前端的json数据,需要哪些返回哪些,我全返回了。
return json(['status'=>200,'is_online'=>$is_online,'chat_id'=>$chat_id,'content'=>$data['content'],
'content_type'=>$data['content_type'],
'from_user_name'=>$from_user_name,
'to_user_name'=>$to_user_name,
'from_id'=>$from_id,
'to_id'=>$to_id
]);
}
发送消息到这儿就实现了。