想要用MUC协议实现群聊功能 , 有太多房间很麻烦 ,用户肯定不会用 ,所以设定好只进入固定的一个房间。
1. 首先设置MUC信息接收器
connection.addHandler(MucMessageReceived, null, "message", "groupchat");//分组对话信息
//接收分组对话信息
function MucMessageReceived(msg){
log("已取得分组对话信息:", Strophe.serialize(msg));
var jid = $(msg).attr("from");//发送组
verifyMucChatTab(jid);//显示多人对话框
var body = $(msg).find("> body");
if (body.length === 1) {
showMessage(jid2id(jid), jid.split("/")[1], body.text());
}
return true;
}
2.进入群聊窗口的按钮
{
text :"群聊" ,onclick :function(){
verifyMucChatTab("oa-room@chat."+getMyDomain());//打开群聊窗口
}
}
3. 打开群聊TAB(我用的是ligerui)
//验证多人对话框
function verifyMucChatTab(jid) {
var id = jid2id(jid.split("/")[0]);//JID
var bareJid = Strophe.getBareJidFromJid(jid.split("/")[0]);
$("#tabs").show();
var chat =$(".l-tab-content > div[tabid ='chat"+id+"']");
if (chat.length === 0) {
//$("#tabs").tabs("add", "#chat" + id, bareJid);
//添加一个tab
tabs_manager.addTabItem({tabid:"chat"+id,text :bareJid});
//对话窗口
chat =$(".l-tab-content > div[tabid ='chat"+id+"']");
chat.append("<div style='height: 290px; margin-bottom: 10px; overflow: auto;'></div><textarea style='width: 100%;height:110px'/>");
chat.data("jid", jid);
$(".l-tab-content > div[tabid =chat'"+id+"']>textarea").keydown(function(event) {
if (event.which === 13) {
event.preventDefault();
sendMucMessage($(this).parent().data("jid"), $(this).val());//发送分组信息
$(this).val("");
}
});
}
//$("#tabs").tabs("select", "#chat" + id);
//选中一个tab
tabs_manager.selectTabItem("chat" + id);
//对话输入框焦点
$(".l-tab-content > div[tabid =chat'"+id+"']>textarea").focus();
}
4. 进入房间的方法(打算一连接服务端就调用)
//进入房间
function enterRoom(jid){//房间JID
//进入房间
var pres = $pres({
id : 'v' + new Date().getTime(),
to : jid+"/"+($("#jid").val().split("@")[0])
}).c(
'x', {
xmlns : 'http://jabber.org/protocol/muc'
}
);
log("正在进入房间", pres.toString());
connection.sendIQ(pres);//获取房间列表
}
5.发送群聊信息方法
//发送对话信息
function sendMucMessage(toJid, text) {
//showMessage(jid2id(toJid), jid, text);//显示对话信息框
var msg = $msg({to: toJid.split("/")[0], "type": "groupchat"}).c('body').t(text);
//日志
log("正在分组发送信息:", Strophe.serialize(msg));
//发送信息
connection.send(msg);
}
6.大致效果