使用Strophe连接xmpp,改XMPP服务地址就能用(一)

最新推荐文章于 2020-02-27 15:39:18 发布

老高呀

最新推荐文章于 2020-02-27 15:39:18 发布

阅读量661

点赞数

CC 4.0 BY-SA版权

分类专栏： xmpp 文章标签： xmpp

本文链接：https://blog.youkuaiyun.com/Jonny_jun_gao/article/details/90479611

xmpp 专栏收录该内容

18 篇文章

订阅专栏

本文介绍如何使用Strophe库连接到XMPP服务器，强调只需更改服务地址即可实现快速接入。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>私聊</title>
    <script src='http://cdn.bootcss.com/jquery/1.9.1/jquery.min.js'></script>
    <script src="js/strophe.js"></script>
    <script src="js/echobot.js"></script>

</head>
<body>

JID：<input type="text" id="input-jid" value="gj@192.168.1.151">
<br>
密码：<input type="text" id="input-pwd" value="qwe">
<br>
<button id="btn-login">登录</button>
<div id="msg" style="height: 400px; width: 400px; overflow: scroll;"></div>
联系人JID：
<input type="text" id="input-contacts" value="gj1@192.168.1.151">
<br>
消息：
<br>
<textarea id="input-msg" cols="30" rows="4"></textarea>
<br>
<button id="btn-send">发送</button>
<button id="btn-online">上线</button>
<button id="btn-ononline">下线</button>
<button id="btn-users">拉取用户</button>
</body>
</html>

var BOSH_SERVICE = 'http://192.168.1.151:5280/http-bind/';
// XMPP连接
var connection = null;


// 当前状态是否连接
var connected = false;


// 当前登录的JID
var jid = "";


// 连接状态改变的事件
function onConnect(status) {
    console.log('status: ' + status)
    if (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("连接成功，可以开始聊天了！");
        console.log('pubsub',connection)
        connected = true;

        // 当接收到<message>节，调用onMessage回调函数
        connection.addHandler(onMessage, null, null, null, null, null);

        // 首先要发送一个<presence>给服务器（initial presence）
        connection.send($pres().tree());

        //获取订阅的主题信息
         // connection.pupubsub.getSubscriptions(onMessage,5000);
        connection.xmlInput = function (elem) {
            console.log("xmlInput: " + elem.outerHTML);
        };
        connection.xmlOutput = function (elem) {
            console.log("xmlOutput: " + elem.outerHTML);
        };

    }
}






// 接收到<message>
function onMessage(msg) {

    console.log('--- msg ---', msg);


    // 解析出<message>的from、type属性，以及body子元素
    var from = msg.getAttribute('from');
    var type = msg.getAttribute('type');
    var elems = msg.getElementsByTagName('body');


    if (type == "chat" && elems.length > 0) {
        var body = elems[0];
        $("#msg").append(from + ":<br>" + Strophe.getText(body) + "<br>")
    }
    return true;
}


$(document).ready(function() {


    // 通过BOSH连接XMPP服务器
    $('#btn-login').click(function() {
        if(!connected) {
            console.log('jid: ' + $("#input-jid").val());
            console.log('pwd: ' + $("#input-pwd").val());
            connection = new Strophe.Connection(BOSH_SERVICE);
            connection.connect($("#input-jid").val(), $("#input-pwd").val(), onConnect);
            jid = $("#input-jid").val();
        }
    });


    // 发送消息
    $("#btn-send").click(function() {
        if(connected) {
            if($("#input-contacts").val() == '') {
                alert("请输入联系人！");
                return;
            }


            // 创建一个<message>元素并发送
            var msg = $msg({
                to: $("#input-contacts").val(),
                from: jid,
                type: 'chat'
            }).c("body", null, $("#input-msg").val());
            connection.send(msg.tree());


            $("#msg").append(jid + ":<br>" + $("#input-msg").val() + "<br>");
            $("#input-msg").val('');
        } else {
            alert("请先登录！");
        }
    });
    //上线
    $("#btn-online").click(function() {
        if(connected) {
            // 创建一个<presence>元素并发送
                var pres =$pres({
                    to: $("#input-contacts").val(),
                    from: $("#input-jid").val(),
                    status:'Online'
                }).nodeTree
            console.log('Online',pres)
            connection.send(pres);
        } else {
            alert("请先登录！");
        }
    });
    //下线
    $("#btn-ononline").click(function() {
        if(connected) {
            connection.disconnect("下线了");
        } else {
            alert("请先登录！");
        }
    });
    //拉取用户
    $("#btn-users").click(function() {
        if(connected) {
            var iq = $iq({type: 'get'}).c('query', {xmlns: 'jabber:iq:roster'});
            connection.sendIQ(iq, function(a){
                console.log('sent iq',a);
                $(a).find('item').each(function(){
                    var jid = $(this).attr('jid'); // jid
                    var name = $(this).attr('name');
                    $("#msg").append("<br>" + jid+"<br>"+name+"<br>");
                });
            });

        } else {
            alert("请先登录！");
        }
    });

});