MQTT在react-native中的运行
mqtt
1、什么是mqtt?
MQTT(Message Queuing Telemetry Transport,消息队列遥测传输协议),是一种基于发布/订阅(publish/subscribe)模式的"轻量级"通讯协议,轻量,高效,具体,请参考菜鸟教程 : https://www.runoob.com/w3cnote/mqtt-intro.html
2、mqtt的几个重要概念
- MQTT协议中有三种身份:发布者(Publish)、代理(Broker)(服务器)、订阅者(Subscribe)
- MQTT传输的消息分为:主题(Topic)和负载(payload)
3、mqtt的几个方法
- (1)Connect。等待与服务器建立连接。
- (2)Disconnect。等待MQTT客户端完成所做的工作,并与服务器断开TCP/IP会话。
- (3)Subscribe。等待完成订阅。
- (4)UnSubscribe。等待服务器取消客户端的一个或多个topics订阅。
- (5)Publish。MQTT客户端发送消息请求,发送完成后返回应用程序线程。
开始
1、地址 :https://github.com/Introvertuous/react_native_mqtt.git
2、安装
yarn add react_native_mqtt
3、使用
import init from 'react_native_mqtt';
import AsyncStorage from '@react-native-community/async-storage'; init({
size: 10000,
storageBackend: AsyncStorage,
defaultExpires: 1000 * 3600 * 24,
enableCache: true,
reconnect: true,
sync: {}
}); 第一步:创建
// 地址,端口,路径(这么写就行了),connectId(随便写) :地址和端口,都是后台给,或者你自己弄个mqtt的服务
let client = new Paho.MQTT.Client('192.168.0.63', 8083, '/mqtt', '/mqttjs_db6017d322') 第二步:连接,暂时有一个参数,2个方法:成功,失败
client.connect({
useSSL: false,
onSuccess: onConnect,
onFailure:(e)=>{ console.log('失败'); console.log(e); }
});
// 成功后需要发送主题 ,就是一个接口的路径类似
function onConnect(){
console.log('成功');
client.subscribe(‘/fangtao’);
}
第三步:断掉
client.onConnectionLost = onConnectionLost; function onConnectionLost (responseObject) {
if (responseObject.errorCode !== 0) {
console.log('onConnectionLost:' + responseObject.errorMessage);
}
} 第四步:接收消息
client.onMessageArrived = onMessageArrived; function onMessageArrived (message) {
console.log('消息:' + message.payloadString);
}
感受一下
run起来,连接成功
后台推送一个消息过来
看看前台接收到没?
成功!
MQTT在react-native中的运行的更多相关文章
- [转] 「指尖上的魔法」 - 谈谈 React Native 中的手势
http://gold.xitu.io/entry/55fa202960b28497519db23f React-Native是一款由Facebook开发并开源的框架,主要卖点是使用JavaScrip ...
- [转] 在React Native中使用ART
http://bbs.reactnative.cn/topic/306/%E5%9C%A8react-native%E4%B8%AD%E4%BD%BF%E7%94%A8art 前半个月捣腾了一下Rea ...
- react native中一次错误排查 Error:Error: Duplicate resources
最近一直在使用react native中,遇到了很多的坑,同时也学习到了一些移动端的开发经验. 今天在做一个打包的测试时,遇到了一个问题,打包过程中报错“Error:Error: Duplicate ...
- React Native中的远程调试是不可靠的
一.原因 当您发现rn app在关闭远程调试后,一些功能无法正常工作时,这很可能是由于设备上的JavaScript执行环境与远程调试器之间的细微差别造成的. 例如,日期问题,Date构造函数似乎接受C ...
- React Native 中 CSS 的使用
首先声明,此文原作者为黎 跃春 React Native中CSS 内联样式 对象样式 使用Stylesheet.Create 样式拼接 导出样式对象 下面的代码是index.ios.js中的代码: / ...
- react native中的欢迎页(解决首加载白屏)
参照网页: http://blog.csdn.net/fengyuzhengfan/article/details/52712829 首先是在原生中写一些方法,然后通过react native中js去 ...
- React Native中的网络请求fetch和简单封装
React Native中的网络请求fetch使用方法最为简单,但却可以实现大多数的网络请求,需要了解更多的可以访问: https://segmentfault.com/a/1190000003810 ...
- react native中使用echarts
开发平台:mac pro node版本:v8.11.2 npm版本:6.4.1 react-native版本:0.57.8 native-echarts版本:^0.5.0 目标平台:android端收 ...
- 在React Native中,使用fetch网络请求 实现get 和 post
//在React Native中,使用fetch实现网络请求 /* fetch 是一个封装程度更高的网络API, 使用了Promise * Promise 是异步编程的一种解决方案 * Promise ...
- 《React Native 精解与实战》书籍连载「React Native 中的生命周期」
此文是我的出版书籍<React Native 精解与实战>连载分享,此书由机械工业出版社出版,书中详解了 React Native 框架底层原理.React Native 组件布局.组件与 ...
随机推荐
- No grammar constraints (DTD or XML Schema) referenced in the document.
问题描述 web.xml 使用 Servlet4.0 版本,No grammar constraints (DTD or XML Schema) referenced in the document. ...
- matlab读取图片的异常表现
在对人脸图片进行对齐时,发现有两张人脸图片一直检测不到人脸,但这两张图片中的人脸明明很好检测(证件照),经过 排查,最终发现问题所在:图片的格式不对. img = imread("**.jp ...
- netstat、ps、top 、kill 命令备忘
1.ps命令用于显示当前进程 (process) 的状态. -aux 显示所有包含其他使用者的行程. -e 显示所有进程. -f 全格式输出. 一般带参数 -ef 或者 -aux ,差别不大. 区别: ...
- C语言博客作业2--循环结构
1.1 思维导图 1.2 本章学习体会及代码量学习体会 1.2.1 学习体会 对本章学习感觉相对前面的难度有较大提升,而且刚开始对嵌套循环比较陌生,像龟兔赛跑和输出菱形都是用了较长时间才完成,所以我认 ...
- 马拉车算法——poj3974
https://segmentfault.com/a/1190000008484167?tdsourcetag=s_pctim_aiomsg 讲的超好! manacher算法理解 回文串分为偶回文串和 ...
- (转载)C# 枚举 FlagsAttribute用法
这是读过几篇文章后发现整理的最完整的一篇文章 转载地址:枚举特性FlagsAttribute的用法 先看官方的解释:指示可以将枚举作为位域(即一组标志)处理. 看起来并不好理解,到底什么是作为位域处理 ...
- Github 上怎样把新 commits 使用在自己的 fork 上
作者:黄晓佳 链接:https://www.zhihu.com/question/20393785/answer/105370502 来源:知乎 著作权归作者所有.商业转载请联系作者获得授权,非商业转 ...
- UOJ#394. 【NOI2018】冒泡排序
原文链接https://www.cnblogs.com/zhouzhendong/p/UOJ394.html 题解 首先我们发现一个数不能既被往左换又被往右换.也就是说不能有任何一个数左边有比他大的, ...
- CSS特例定位方式
同级向下一个元素定位,一个+表示下一个元素,++表格下下个元素 input[name='name1'] +input td:eq(0)表示第一个td元素,此定位方式限于执行js,在selenium时用 ...
- IOS8,IOS8.1等系统出现锁屏状态下WIFI断开问题的解决办法!
网络设备:TP-Link 300M无线路由器.DLINK 300M无线路由器.HP 300M无线路由器.APPLE AirPort无线路由器 终端:iphone5S+IOS8.1 故障现象:除appl ...