网页端HTML使用MQTTJs订阅RabbitＭＱ数据 - baivfhpwxf - 博客园

Excerpt
最近在做一个公司的日志组件时有一个问题难住了我。今天问题终于解决了。由于在解决问题中，在网上也查了很多资料都没有一个完整的实例可以参考。所以本着无私分享的目的记录一下完整的解决过程和实例。需求：做一个统一日志系统可以查看日志列表和一个可以订阅最新日志的页面。通过提供一个封装好日志记录方法的sdk文

　　最近在做一个公司的日志组件时有一个问题难住了我。今天问题终于解决了。由于在解决问题中，在网上也查了很多资料都没有一个完整的实例可以参考。所以本着无私分享的目的记录一下完整的解决过程和实例。

　　需求：做一个统一日志系统可以查看日志列表和一个可以订阅最新日志的页面。通过提供一个封装好日志记录方法的sdk文件将日志统一收集。

　　通过上面的需求进行我们使用RabbitＭＱ+Mongodb来实现系统。

　　使用Ｃ#封装一个ＳＤＫ大家都会这里就不说了。Ｃ#连接RabbitＭＱ示例代码也是一堆堆的也没什么好说的。下面重点说一下网页端如何使用JS去订阅RabbitＭＱ收到的最新日志信息。

　　后端都是使用RabbitＭＱ的ＡＭＱＰ协议，而前端要求在网页HTML上显示数据。我们选择了使用ＭＱＴＴ协议从RabbitＭＱ中订阅数据。

　　具体步骤：

１、先准备好相关JS库。ＭＱＴＴ有一个叫browserMqtt.js看名字就知道是为浏览器提供的JS库。还有一个封装了操作MQ的JS库　mqfactory.js。最后还要一个jquery.js文件。这样工具就准备好了。JS文件下载

２、ＨＴＭＬ端代码。

View Code

３.后端代码：

３.１客户端sdk代码

View Code

３.２后端ＭＱ代码：

View Code

３.３路由

View Code

注意点：

１、ＭＱＴＴ的路由是以　/ 来分割的。在RabbitＭＱ中会被转义成　. 如示例中的路由Dcon/Logs/Client会被转换成　Dcon.Logs.Client

２、网页端接收时的路由要和发送端的路由一至。也就是说后端用　Dcon.Logs.Client　来推数据前端就要使用　Dcon/Logs/Client来接收数据。

３、ＭＱＴＴ路由不支持通配符.

４、由于ＭＱＴＴ的ＪＳ库没有提供Topic交换机与路由绑定功能。所以前端接收时不能设置订阅主题交换机名称。如果要和amqp交互只能使用amqp的默认主题交换机名称　amq.topic

运行效果图：