参考于下面文章:
https://blog.csdn.net/yuruixin_china/article/details/76348812
但是请求url不太对,也不太适合,稍作修改:
修改参考下面文章:
https://blog.csdn.net/Pai_Da_Xing/article/details/88882059#commentBox
html代码(没做修改):
<!DOCTYPE html>
<html>
<head><script src='http://cdn.bootcss.com/jquery/1.9.1/jquery.min.js'></script><script src='http://cdn.bootcss.com/strophe.js/1.1.3/strophe.min.js'></script><script src='test.js'></script>
</head>
<body>JID:<input type="text" id="input-jid"><br>密码:<input type="password" id="input-pwd"><br><button id="btn-login">登录</button><div id="msg" style="height: 400px; width: 400px; overflow: scroll;"></div><br>消息:<br><textarea id="input-msg" cols="30" rows="4"></textarea><br><button id="btn-send">发送</button>
</body>
</html>
js代码:test.js(改动):
// XMPP服务器BOSH地址var BOSH_SERVICE = 'http://域名:5280/xmpp-httpbind';
// 例如 var BOSH_SERVICE = 'http://192.168.30.130:5280/xmpp-httpbind';// 房间JID
//var ROOM_JID = 'fangjainhao@conference.192.168.1.204';// XMPP连接
var connection = null;// 当前状态是否连接
var connected = false;// 当前登录的JID
var jid = "";
// 连接状态改变的事件
function onConnect(status) {debuggerif (status == Strophe.Status.CONNFAIL) {alert("连接失败!");} else if (status == Strophe.Status.AUTHFAIL) {alert("登录失败!");} else if (status == Strophe.Status.DISCONNECTED) {alert("连接断开!");connected = false;} else if (status == Strophe.Status.CONNECTED) {alert("连接成功,可以开始聊天了!");connected = true;// 当接收到<message>节,调用onMessage回调函数connection.addHandler(onMessage, null, 'message', null, null, null);// 首先要发送一个<presence>给服务器(initial presence)connection.send($pres().tree());// 发送<presence>元素,加入房间var pres = $pres({from: jid,to: ROOM_JID + "/" + jid.substring(0,jid.indexOf("@"))}).c('x',{xmlns: 'http://jabber.org/protocol/muc'}).tree();connection.send(pres);//connection.sendIQ(pres);//获取房间列表}
}// 接收到<message>
function onMessage(msg) {console.log(msg);// 解析出<message>的from、type属性,以及body子元素var from = msg.getAttribute('from');var type = msg.getAttribute('type');var elems = msg.getElementsByTagName('body');if (type == "groupchat" && elems.length > 0) {var body = elems[0];$("#msg").append(from.substring(from.indexOf('/') + 1) + ":<br>" + Strophe.getText(body) + "<br>")}//只处理chat类型消息if (type == "chat" && elems.length > 0) {var body = elems[0];console.log('我收到了来自: ' + from + ': ' + window.Strophe.getText(body));alert('我收到了来自: ' + from + ': ' + window.Strophe.getText(body))}return true;
}$(document).ready(function() {// 通过BOSH连接XMPP服务器$('#btn-login').click(function() {debuggerif(!connected) {connection = new Strophe.Connection(BOSH_SERVICE);connection.connect($("#input-jid").val()+"@im.weiapp.net", $("#input-pwd").val(), onConnect);/*connection.connect($("#input-jid").val(), $("#input-pwd").val(), onConnect);*/jid = $("#input-jid").val();}});// 发送群消息/*$("#btn-send").click(function() {if(connected) {// 创建一个<message>元素并发送var msg = $msg({to: ROOM_JID,from: jid,type: 'groupchat'}).c("body", null, $("#input-msg").val());connection.send(msg.tree());$("#input-msg").val('');} else {alert("请先登录!");}});*/// 发送一对一消息$("#btn-send").click(function() {if(connected) {// 创建一个<message>元素并发送var msg = $msg({to: "test1@192.168.30",from: "test2@192.168.30",type: 'chat'}).c("body", null, $("#input-msg").val());connection.send(msg.tree());$("#input-msg").val('');} else {alert("请先登录!");}});
});
希望能帮到你!