登录 用户中心() [退出] 后台管理 注册
   
您的位置: 首页 >> SoftHub关联区 >> 主题: [xmpp/xmppmini/Openfire]使用WebSocket建立Openfire的客户端[zt]     [回主站]     [分站链接]
[xmpp/xmppmini/Openfire]使用WebSocket建立Openfire的客户端[zt]
clq
浏览(356) - 2020-11-18 15:08:29 发表 编辑

关键字:

[2020-11-18 15:09:18 最后更新]
[xmpp/xmppmini/Openfire]使用WebSocket建立Openfire的客户端[zt]

https://www.cnblogs.com/wuxinzhe/p/6619209.html


[Openfire]使用WebSocket建立Openfire的客户端

      近日工作闲暇之余,对IM系统产生了兴趣,转而研究了IM的内容。找了半天,知道比较流行的是Openfire的系统,Openfire有许多平台实现,由于我是做Web的,所以当然是希望寻找Web的实现。Openfire的以前的Web实现,是基于Http-bind的一种长轮询机制,当然也没什么不好,只是我现在HTML5都开始了,当然希望能够来个基于Websocket的机制了。然而Google&百度了好久,也没有找到什么教程,发现这个东西并不是很火热的样子,那只好自己开始研究了。于是有了这一篇文章。

      对了,我知道xmpp的JS框架有几个,但那些框架似乎都是按照原本的长轮询的机制来做的,并不是使用Websocket来做的。

      另外,做软件2年了,当我刚涉足这个行业时,我被告知:“不要重复造轮子!”,曾经我对此深信不疑,但这两年的工作让我越发认识,不要重复造轮子,仅仅是在于做项目当中,做一个商业产品的时候,考虑到开发速度和产品后期的稳定性及维护性,确实需要采用成熟的技术,但!这不代表作为一个程序员,不应该抱着一种从0开始的研究精神,如果真的热爱这个行业,这个领域,就应该尝试着,根据RCF文档协议,从基础协议的层次开始做软件。

    好了,废话不多说。恩,开始正文吧。
So 得先搞一个服务端是吧?
 

  肯定是去 Openfire 的官网下载最新的Openfire服务端程序啦,Openfire的是开源的,可以免费下载。如图:

    Openfire 的主程序,主程序是服务端程序,这个主程序不是一个框架,不是一个半成品,而是一个很完整的项目,怎么个很完整?就是你下载下来,直接双击运行(Windows),或到其程序的根目录下bin文件夹,然后执行 openfire start 命令(Linux),Mac就更简单了,直接在“设置”当中会有一个专门的管理窗口。然后它有一个Web版的管理后台,所有设置都可以在这个后台完成,包括安装插件之类的。
    这个火花(Spark)是Openfire搭配的客户端,也是多平台支持的。
    这个地方可以下载Openfire的源代码,你可以把他放到你的IDE中,然后简单配置一下,就可以run起来,这个教程网上很多,我就不多废话了。

  
 安装WebSocket插件

   

  这就不说了。
建立Websocket连接
 

  安装了WebSocket插件之后,有两个原本用于http-bind的端口,就被WebSocket占用了(有了WebSocket,还需要Http-bind做啥= =)。这两个接口分别是7443和7070,前者是用于HTTPS安全连接,后者是非安全连接。

  建立链接:
复制代码

 1   var connectionState = ["正在连接..", "连接已建立", "正在关闭..", "已经关闭"];
 2     var host = "ws://127.0.0.1:7070/ws/";
 3     if (window.WebSocket != 'undefined') {
 4         //OpenFire是实现了WebSocket的子协议
 5         var connection = new WebSocket(host, "xmpp");
 6         console.log(connectionState[connection.readyState]);
 7         //注册连接建立时的方法
 8         connection.onopen = wsOpen;
 9         //注册连接关闭时的方法
10         connection.onclose = wsClose;
11         //注册收到消息时的方法
12         connection.onmessage = wsMsg;
13     }

复制代码

  如果要使用Https加密信道,就把Host改成:

var host="wss://127.0.0.1:7443/ws/

  恩,建立安全连接还需要添加安全证书到Keystore,这个在Openfire的根目录下,有一个resource/security文件夹,里面有keyStore文件,当然,这部分我还不是很懂,关于Https的加密信道,TSL/SSl证书的概念,还没完全弄明白,不过这也不是这篇文章的重点。暂时我就先用非加密的方式来做,至于加密的连接,除了host的区别,其他也没有区别。

  当Websocket握手之后,我们要做的第一件事,就是发起一个建立流的请求,
复制代码

1 function wsOpen(event) {
2         //打印链接状态
3         console.log(connectionState[connection.readyState]);
4         //发送建立流请求
5         var steam = "<open to='127.0.0.1' from='wuxinzhe@127.0.0.1'  xmlns='urn:ietf:params:xml:ns:xmpp-framing' xml:lang='zh' version='1.0'/>";
6         connection.send(steam);
7     }

复制代码

 

  Websocket下,建立流不像其他平台那样,使用<stream:stream/>标签,而是使用<open/>标签,其中to属性是域名,from是你的JID。

  发出请求之后,会立刻收到服务器的响应:

  第一条响应式服务器同意建立流,第二条是告诉你,安全验证的几种方式,其中最简单的方式是PLAIN方式,这种方式仅仅是将你的账号密码进行BASE64加密后传输,可以说是很不安全。当然,你也可以选择SCRAM-SHA-1的安全加密方式,只不过你的js库要支持SHA-1加密,我因为是刚开始探路,所以一切从简,SHA-1的加密方式请求流程跟PLAIN会有一点区别,回头咱们再说。

  另外我这边写了一个当收到来自服务端信息的方法:

  function wsMsg(event) {
        console.log("Server: " + event.data);
    }

 

  打印出来而已。就像上面console面板中的信息一样。那个是chrome的调试器,其他浏览器也有对应的。

 
发起登录验证

 

  刚才说了,我先用最基本的PLAIN的方式登录:
复制代码

   function auth() {
        //Base64编码
        var token = window.btoa("wuxinzhe@127.0.0.1\0wuxinzhe");
        var message = "<auth xmlns='urn:ietf:params:xml:ns:xmpp-sasl' mechanism='PLAIN'>" + token + "</auth>";
        console.log("Client: " + message);
        connection.send(message);
    }

复制代码

 

 

  其中,window.btoa()是自带的方法,不需要额外加载任何库,所以我才说这个真的是最快最简单的方法,然后我们看方法体内的字符串,这个字符串格式是:jid+password,以\0作为分隔符,后端java程序是一个DefaultAuthProvider提供验证的,当然你们也可以实现自己的验证方式,默认的方式是以\0作为分隔符,注意的是,我一开始密码是123456,发现\0123456这样到后端密码会被分割成23456,\01整个会被转译,恩,解决的办法要嘛就换一个分隔符(我是说后端的openfire那边),要嘛就禁止以数字开头的密码。

  发起安全验证之后,会受到服务端的响应, 如果成功了,如图:  

  至于要是失败了,会返回这个错误,当然这个错误信息很少,到底是用户名找不到,还是密码错误了,单凭这个错误信息是看不出来的,不过也没办法咯,要不,去修改一下服务端呗:

 

  当我们发起安全验证成功了以后,紧接着就要开启一个新的流,新的流服务端会给予一些新的XML节点权限(<iq/>、<presence/>),这样才能发送一些其他功能的信息,比如发送消息,获取联系人列表,再刚开始建立的第一个流失不能发送这些节点的。

  建立新流同样适用<open/>标签,但有一个地方与之前不同,就是这次是需要携带id属性的,什么是id属性?我们回顾第一个流建立时,服务端返回的<open/>信息,是不是就有一个id,没错,这个id据我的理解,每次建立websocket连接时,都会为每个连接生成一个独一无二的id,这个id代表了这个连接,所以后续我们会在很多很多地方都需要使用这个id。

  发起新的流:

1 <open xmlns='jabber:client' to='127.0.0.1' version='1.0' from='wuxinzhe@127.0.0.1' id='70tvu3ooiu' xml:lang='zh'/>

  服务端会返回两条信息,第一条,是同意打开新流,第二条,是告诉你,接下来要做的是bind操作,就是要绑定客户端:

  发起绑定也要用到刚才说的id属性:

<iq type='set' id='6ps7q3ideb'><bind xmlns='urn:ietf:params:xml:ns:xmpp-bind'/></iq>

  绑定的时候,还可以加入一些标签,来对当前的客户端,做一些比较具有语义的说明,用来描述你的客户端类型:

<iq id="wSBRk-4" type="set">  
<bind xmlns="urn:ietf:params:xml:ns:xmpp-bind">  
<resource>Showings</resource>  
</bind>  
</iq>

 

  我们看看这两种bind之间的区别:

  这是bind的客户端请求内容和服务端响应内容,上面的是没有加入<resource/>标签的,下面是加入了以后。我们可以看到,服务端返回信息中的<jid/>是有区别的,当不加描述节点的时候,是将前面的id属性直接用作后缀拼接如JID的,加入了以后自然会更具语义化。

  这个过程似乎是Openfire用于区分登录的客户端类型的方式。这样如果同一个账号,在不同的客户端登录,也会有所区别。  

  然后我们要获取session。

<iq xmlns="jabber:client" id="ak014gz6x7" type="set"><session xmlns="urn:ietf:params:xml:ns:xmpp-session"/></iq>

  这部分我暂时还不知道用来干嘛的,毕竟我还没熟悉openfire的xmpp协议的整个过程,所以有些部分不是很清楚,待我整个看过以后,到时候再来看看这个步骤是做什么用的。

  此时我们进入Openfire的后台,看看用户在线的情况:

  诶?怎么有连接,却是离线呢?不着急,因为我们虽然登陆了,但是我们还没有“出席”。就像QQ你可以设置不同的登录状态,有在线、不在电脑、忙、离线,这些状态,所以我们如果要在线,只需要发送出席请求就行了:

<presence id="ak014gz6x7"><status>Online</status><priority>1</priority></presence>

  你们看,到处都要用到这个ID,当然,前面我们做了绑定动作,此刻不用id属性,换成from="jid"应该也是有效的。

  此时我们再看后台状态:

  OK了。

  So我们还要下线呢,关闭连接,此时要用<open/>对应的标签<close/>

<close xmlns="urn:ietf:params:xml:ns:xmpp-framing"/>

  这样就行了。

    其实使用Websocket建立连接与XMPP协议在其他的客户端里是没有什么太大的区别,可能就是<open/><close/>这两个标签的区别。我们现在能够顺利登录了,基本上,就是有一个好的开始了。
分类: Openfire



总数:0 页次:1/0 首页 尾页  
总数:0 页次:1/0 首页 尾页  


所在合集/目录



发表评论:
文本/html模式切换 插入图片 文本/html模式切换


附件:



NEWBT官方QQ群1: 276678893
可求档连环画,漫画;询问文本处理大师等软件使用技巧;求档softhub软件下载及使用技巧.
但不可"开车",严禁国家敏感话题,不可求档涉及版权的文档软件.
验证问题说明申请入群原因即可.

Copyright © 2005-2020 clq, All Rights Reserved
版权所有
桂ICP备15002303号-1