js client使用paho-mqtt,官网地址:http://www.eclipse.org/paho/,参考http://www.eclipse.org/paho/clients/js/官网给出例子Getting Started,写出下面简单的测试代码。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Centos7 mosquitto test</title>
<script src="jquery-3.2.1.min.js"></script>
<script src="paho-mqtt-min.js"></script>
<script type="text/javascript">
var hostname = "csxyz.xyz"; //主机IP 106.14.181.32 此域名已不是我在使用了(2019-6-16注)
var hostPort = 9001; //port
var sub_count = 0;
var client;
function MQTTconnect() {
client = new Paho.MQTT.Client(hostname, hostPort, "test");
client.onMessageArrived = onMessageArrived;
client.connect({onSuccess:onConnect});
console.log("Host="+ hostname + ", port=" + hostPort);
};
// called when the client connects
function onConnect() {
console.log("onConnect succeeds");
// client.subscribe('topic');
client.subscribe('#'); //订阅所有主题
}
// called when a message arrives
function onMessageArrived(message) {
var topic = message.destinationName;
var payload = message.payloadString;
console.log("onMessageArrived:" + payload);
sub_count++;
$('#sub_count').val('收到订阅' + sub_count + '条');
$('#sub_message').prepend('<li>' + topic + ' = ' + payload + '</li>');
}
function button_onclick(){
var topic = $('#topicsend').val();
var text = $('#textsend').val();
if(topic=='' || text=='')
{
alert("noTopic or noText");
return;
}
var message = new Paho.MQTT.Message(text);
message.destinationName = topic;
message.qos=0;
client.send(message);
};
$(document).ready(function() {
MQTTconnect();
});
</script>
</head> <body>
<h1>mosquitto pub</h1>
topic:<input type='text' id='topicsend' size="60"/> <br>
text :<input type='text' id='textsend' size="60"/>
<input type='button' value="send" id='btn' onclick="button_onclick()"/>
</br>
<h1>mosquitto sub</h1>
<input type='text' id='sub_count' disabled />
<ul id='sub_message' ></ul>
</body>
</html>

html在本地运行,测试结果:

在censtos的apache空间根目录下创建文件夹iot,将index.html和需要包含的js文件拷贝过去,可以得到上面的结果。注意,文件上传的时候是在root用户下,需要增加可执行权限,否则运行会报错的。

javascript mqtt 发布订阅消息的更多相关文章

  1. JMS发布/订阅消息传送例子

    前言 基于上篇文章"基于Tomcat + JNDI + ActiveMQ实现JMS的点对点消息传送"很容易就可以编写一个发布/订阅消息传送例子,相关环境准备与该篇文章基本类似,主要 ...

  2. Kafka是分布式发布-订阅消息系统

    Kafka是分布式发布-订阅消息系统 https://www.biaodianfu.com/kafka.html Kafka是分布式发布-订阅消息系统.它最初由LinkedIn公司开发,之后成为Apa ...

  3. 高吞吐量的分布式发布订阅消息系统Kafka--安装及测试

    一.Kafka概述 Kafka是一种高吞吐量的分布式发布订阅消息系统,它可以处理消费者规模的网站中的所有动作流数据. 这种动作(网页浏览,搜索和其他用户的行动)是在现代网络上的许多社会功能的一个关键因 ...

  4. 分布式发布订阅消息系统 Kafka 架构设计[转]

    分布式发布订阅消息系统 Kafka 架构设计 转自:http://www.oschina.net/translate/kafka-design 我们为什么要搭建该系统 Kafka是一个消息系统,原本开 ...

  5. 分布式发布订阅消息系统Kafka

    高吞吐量的分布式发布订阅消息系统Kafka--安装及测试   一.Kafka概述 Kafka是一种高吞吐量的分布式发布订阅消息系统,它可以处理消费者规模的网站中的所有动作流数据. 这种动作(网页浏览, ...

  6. Kafka logo分布式发布订阅消息系统 Kafka

    分布式发布订阅消息系统 Kafka kafka是一种高吞吐量的分布式发布订阅消息系统,她有如下特性: 通过O(1)的磁盘数据结构提供消息的持久化,这种结构对于即使数以TB的消息存储也能够保持长时间的稳 ...

  7. 发布-订阅消息系统Kafka简介

    转载请注明出处:http://www.cnblogs.com/BYRans/ Kafka是由Apache软件基金会开发的一个开源流处理平台,由Scala和Java编写.Kafka是一种高吞吐量的分布式 ...

  8. Kafka(分布式发布-订阅消息系统)工作流程说明

    Kafka系统架构Apache Kafka是分布式发布-订阅消息系统.它最初由LinkedIn公司开发,之后成为Apache项目的一部分.Kafka是一种快速.可扩展的.设计内在就是分布式的,分区的和 ...

  9. 【9】JMicro微服务-发布订阅消息服务

    如非授权,禁止用于商业用途,转载请注明出处作者:mynewworldyyl 1. JMicro消息服务目前实现特性 a. JMicro只支持发布订阅消息服务,不支持队列式消息服务: b. 不支持消息持 ...

随机推荐

  1. 机器学习之 XGBoost和LightGBM

    目录 1.基本知识点简介 2.梯度提升树GBDT算法 2.1 思路和原理 2.2 梯度代替残差建立CART回归树 3.XGBoost提升树算法 3.1 XGBoost原理 3.2 XGBoost中损失 ...

  2. 【JS】【5】request.getHeader("referer")的作用

    正文: request.getHeader("referer"):获取来访者地址 注意:只有通过链接访问当前页的时候,才能获取上一页的地址,以下情况是获取不到值的: 只有通过链接访 ...

  3. DataSet select 的使用

    1) Select()——获取所有 System.Data.DataRow 对象的数组. 2) Select(string filterExpression)——按照主键顺序(如果没有主键,则按照添加 ...

  4. SQL列转行用逗号隔开

      declare @result varchar(255) set @result = ” select @result = @result + cast(F_IT_FWID as varchar( ...

  5. Python3+qrcode+zxing生成和识别二维码教程

    一.安装依赖库 pip install qrcode pillow image zxing pillow是python3中PIL的代替库,image是生成图版需要用到的库 安装image时报错“Cou ...

  6. Oracle单机Rman笔记[1]---环境准备

    A.-----安装程序准备---- 1.拷贝oracle安装包到一个目录下 2.检查并修改hostname /etc/sysconfig/network中的hostname要与/etc/hosts中的 ...

  7. python3-连接MySQL(mysql.connector与MySQLdb区别)

    import mysql.connector cnx = mysql.connector.connect(user='scott', password='tiger',host='127.0.0.1' ...

  8. less和sass的定义和区别

    less是单独的一种文件,可以理解为css的升级版: sass是一个相对新的编程语言,为web前端开发而生,可以用它来定义一套新的语法规则和函数: 区别: ①   表现方式不同:less基于javas ...

  9. boost range zhuan

    Officialhttp://67.223.234.84/boost_doc/libs/range/doc/utility_class.html#sub_range http://blog.sina. ...

  10. ECB cspk7 加密

    public function test(){ $param = input('param.'); // $input = 'userid=7&gameid=100107&buycou ...