Client A 发送类似的数据给 Server。Server 接收数据根据 to 值找到 Client B 的 Socket 连接并将消息转发给 Client B。
用户登录就把用户存储到在线用户列表中去,触发‘login’事件:
public里面chat.js进行初始化:
function init() {
socket = io();
socket.emit('login', uid);
...
}
www里面进行更改:
socket.on('login', function(usrName) {
var uid=usrName;
users[uid] = socket.id;
sockets[socket.id] = {uid:uid,socket:socket};
online.push(uid);
});
用户给指定好友发送消息
public>chat.js里面进行选择好友进行聊天:
function doChat() {
fid = $(this).attr('id'); //获取好友的id
var fname = $(this).find("#friendName").text();
$("#chatObj p").text(fname);
setUnreadMsg(); //更改未读的信息
$(".historyMsg").prepend('<ul class="chatContent" id="v'+fid+'"></ul>');
$(".historyMsg .chatContent").hide();
$("#v"+fid).show(); //切换页面到与该好友聊天的页面
initMsg(); //初始化与好友的历史消息
}
//选择好友聊天时,初始化与好友的聊天记录
function initMsg() {
$.ajax({
type: "POST",
url: "/users/initMsg",
dataType: "json",
contentType: "application/json",
data: JSON.stringify({
'userId': uid,
'fid': fid
}),
success: function (data) {
for(var i=0; i<data.length;i++) {
var fromID=data[i].from;
var toId=data[i].to;
if(uid == fromID) {
if(fid==toId) {
displayNewMsg('me', data[i].content);
}
} else if(fid == fromID) {
if(uid ==toId){
displayNewMsg(fid,data[i].content);
}
} else {
console.log("the news chat with others");
}
}
}
});
}
发送消息触发private message事件
function doSend() {
var msg=$('#messageInput').val();
$('#messageInput').val('');
socket.emit('private message',uid,fid,msg);
displayNewMsg('me', msg);//把消息显示到出来
return false;
}
www里面private message事件
socket.on('private message', function(uid,fid,message){
var status;
if(online.indexOf(fid)!==-1){
status = 1;
sockets[users[fid]].socket.emit('newMsg',fid,message);//找到好友的socket.id然后把消息发送给好友,触发chat.js的newMsg事件
} else{
// 如果不在线的话,状态为0
status = 0;
}
//不管在不在线都把消息存到message数据库中去
var data={
userId: uid,
from: uid,
to: fid,
status: status,
content: message
}
//把消息存到数据库中去
dbHelper.addMsg(data,function (success,doc) {
console.log("right");
});
}
然后chat.js里面newMsg以及显示消息displayNewMsg事件:
function init() {
···
socket.on('newMsg', function(id,msg) {
displayNewMsg(id, msg);
});
}
function displayNewMsg(user, msg) {
$("#v"+fid).append('<li class="'+(user === "me" ? "me" : "other")+'">'+
'<div class="time">'+
'<span>time</span>'+
'</div>'+
'<div class="msg">'+
'<img src="/images/2.jpg" class="img-rounded">'+
'<p>'+msg+'</p>'+
'</div>'+
'</li>'
);
}
离线消息
之前把消息存到数据库里面了用户这边和好友都要存,如果好友不在的话该好友的状态信息 的状态就设为0,如果好友在线的话,就把该好友的消息状态设为1,
exports.addMsg = function(data, cb) {
//这个地方获取的是从ajax传过来的数据
var userMsg = new Msg({
usrId: data.userId,
from: data.from,
to: data.to,
content: data.content,
status: 1
});
userMsg.save(function (err) {
if(err){
console.log(err)
} else{
console.log("user right");
cb(null,entries);
}
})
var friendMsg = new Msg({
usrId: data.to,
from: data.from,
to: data.to,
content: data.content,
status: data.status
});
friendMsg.save(function (err) {
if(err){
console.log(err);
} else{
console.log("friend right");
cb(null,entries);
}
});
}
用户上线的时候有未读消息:
初始化未读消息:
function unreadMsg() {
$.ajax({
type: "POST",
url: "/users/unreadMsg",
dataType: "json",
contentType: "application/json",
data: JSON.stringify({
'userId': uid
}),
success: function (data) {
for(var i=0;i<data.length;i++){
$('#'+data[i].from).find('.unreadMsg').show();
$('#'+data[i].from).find('#friendName').css('margin-left','0');
var j=$('#'+data[i].from).find('.unreadMsg').html();
$('#'+data[i].from).find('.unreadMsg').html(parseInt(j)+1);//更改来自好友的未读消息数量
}
}
});
}
//路由
router.post('/unreadMsg', function(req, res, next) {
dbHelper.unreadMsg(req.body,function (success, doc) {
res.send(doc);
});
});
//到数据库中去查找来自好友的状态为0的消息
exports.unreadMsg = function(data, cb) {
Msg.find({usrId: data.userId,to: data.userId,status:0})
// .populate('from')
.exec(function(err,docs){
var msgList = new Array();
for(var i = 0;i < docs.length; i++) {
msgList.push(docs[i].toObject());
}
cb(true,msgList);
});
}
查看未读消息
public chat.js里面
//更改未读消息的显示,查看之后就把消息的状态设置为1
function setUnreadMsg(){
$.ajax({
type: "POST",
url: "/users/setUnreadMsg",
dataType: "json",
contentType: "application/json",
data: JSON.stringify({
'userId': uid,
'fid':fid
}),
success: function (data) {
$('#'+fid).find('.unreadMsg').html('0');
$('#'+fid).find('.unreadMsg').hide();
$('#'+fid).find('#friendName').css('margin-left','10px');
}
});
}
//路由
router.post('/setUnreadMsg', function(req, res, next) {
dbHelper.setUnreadMsg(req.body,function (success, doc) {
res.send(doc);
});
});
//dbHelper把消息的状态更改为1
exports.setUnreadMsg = function(data, cb) {
Msg.find({usrId: data.userId,from:data.fid,to: data.userId,status:0})
.update({$set: {'status': 1}})
.exec(function(err,docs){
var msgList = new Array();
for(var i = 0;i < docs.length; i++) {
msgList.push(docs[i].toObject());
}
cb(true,msgList);
});
}
遇到的问题:
测试的时候在同一个浏览器下打开两个页面进行聊天的时候A发送给B的消息,B能收到,B回复给A的消息,A却收不到。
更改
发现是在同一个浏览器下共享同一个session,在google设置增加一个用户,这样就可以了
网友评论