uniapp 开发微信小程序使用TCP/UDP通信以16进制发送数据

这篇具有很好参考价值的文章主要介绍了uniapp 开发微信小程序使用TCP/UDP通信以16进制发送数据。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

在微信小程序中实现像网络调试工具按16进制发送的功能。

1. TCP方式

微信小程序tcp通信,物联网,udp

<button type="primary"  @click="btnTCP()">tcp通信</button>
<script>
	//创建一个 TCP Socket 实例
	const tcp = wx.createTCPSocket() 
	
	export default {
		data() {
			return {							

			}
		},
		
		onLoad() {
			//启动连接
			tcp.connect({
				address: '192.168.1.87', 
				port: 8866
			})
			
			//连接成功建立的时候触发该事件
			tcp.onConnect(function(e){
			    console.log('连接成功')				
			})
			
			//接收到数据的时候触发该事件
			tcp.onMessage(function(e){
				console.log(e.message)
				//ArrayBuffer转16进制字符串
				let buffer = e.message
				let hexstr = Array.prototype.map.call(new Uint8Array(buffer), x => ('00' + x.toString(16)).slice(-2)).join('')
				console.log(hexstr)
			})	
		},
		
		onUnload() {
			//关闭连接
			tcp.close( )
		},
		
		
		methods: {			
			btnTCP(){
				//将一个十六进制报文转为字符数组
				let str = 'cf 03 00 00 00 00 1e 59 ce 96 7f 01 00 00 a5'
				let strs = str.split(" ") 				
				for(let i = 0;i<strs.length;i++){				
				  strs[i] = "0x"+strs[i]	 //每个字符加上0x			
				}				
				let buffer = Buffer.from(strs) //将数组放到buffer				

				//发送数据
				tcp.write(buffer)			
			}
		}			
	}
</script>

2. UDP方式

如下图调试工具接收到微信小程序发送的16进制数据
微信小程序tcp通信,物联网,udp

<button type="primary"  @click="btnUDP()">udp通信</button>
btnUDP(){	
	//将一个十六进制报文转为字符数组	
	let str = 'cf 03 00 00 00 00 1e 59 ce 96 7f 01 00 00 a5'				
	let strs = str.split(" ")				
	for(let i = 0;i<strs.length;i++){				
	  strs[i] = "0x"+strs[i]	 //每个字符加上0x			
	}				
	let buffer = Buffer.from(strs) //将数组放到buffer				
	
	//创建一个 UDP Socket 实例			
	const udp = wx.createUDPSocket()
	//指定要绑定的本地端口号,留空是随机端口
	udp.bind(8877)
	//向指定的 IP 和 port 发送消息
	udp.send({ 		 
		address:'192.168.1.255',
		port: '8866',
		message: buffer
	})			
}

以上代码是在 uniapp 开发工具进行编写,然后编译 运行到小程序模拟器才能正常使用。如果直接用微信开发者工具编译,会报错: ReferenceError: Buffer is not defined

源码下载地址:
链接:https://pan.baidu.com/s/1AVB71AjEX06wpc4wbcV_tQ?pwd=l9zp
提取码:l9zp文章来源地址https://www.toymoban.com/news/detail-556846.html

到了这里,关于uniapp 开发微信小程序使用TCP/UDP通信以16进制发送数据的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 使用uniapp开发微信小程序的人脸采集功能/人脸识别功能

    ✅作者简介:大家好我是瓜子三百克,励志成为全栈工程师的一枚程序猿,也是喜欢在学习和开发中记录笔记的小白博主! 📃个人主页:瓜子三百克的主页 🔥系列专栏:uniapp前端 💖如果觉得博主的文章还不错的话,请点赞👍+收藏⭐️+留言📝支持一下博主哦🤞 本篇文章

    2024年02月11日
    浏览(55)
  • uniapp 开发微信小程序用相机拍照后使用Canvas翻转图片

    傻逼了,兄弟们,uniapp和微信都有一个专门调用手机拍照和相册的api ,拍完照片后会自动根据设备方向翻转,从而始终是正面。如果还想看canvas翻转下面也有    离谱,canvas实例要在onReady里面定义,我找了几个小时才找到。  由于开发需求是要竖着拍照横着返回,所以就必须

    2024年02月13日
    浏览(53)
  • uniapp开发微信小程序 ,使用本地图片做背景图应该怎么处理

    注意,把获取可用的base64地址的方法放在computed 里面是非常必要的。如果放在methods里面初次进入这个页面时候会报错(除了首页之外)。这里就是跟methods和computed特性有关。

    2024年02月16日
    浏览(57)
  • uniapp开发微信小程序实现语音识别,使用微信同声传译插件,

    第一步:在微信小程序管理后台:“设置”-》“第三方设置”-》“插件管理”中添加插件。 但是这个地方,没有搜索到插件,就到微信服务市场 搜索到以后添加到需要的小程序里面,然后返回管理中心查看,就可以看到了 第二步:在配置文件中引入插件 第三步:在需要使

    2024年02月05日
    浏览(48)
  • uniapp开发微信小程序使用painter将页面转换为图片并保存到本地相册

    我使用到painter的原因是,在uniapp开发微信小程序时,需要将一个页面的内容转换成图片保存到本地相册。 起初在网上找到很多都是在 uniapp 中使用 html2canvas 将 网页转换成图片再 jspdf 将图片转换为pdf ,但是这种方式在小程序环境不支持,只在 h5 环境下适用, 当然这个方式是

    2024年02月12日
    浏览(42)
  • uniapp开发微信小程序,使用微信同声传译插件,实现语音识别输入文本

    第一步:现在微信小程序管理后台:“设置”-》“第三方设置”-》“插件管理”中添加插件。 但是这个地方,没有搜索到插件,就到微信服务市场去搜微信服务市场  搜索到以后添加到需要的小程序里面,然后返回管理中心查看,就可以看到了 第二步:在配置文件中引入插

    2024年02月09日
    浏览(64)
  • uniapp 开发微信小程序使用echart的dataZoom属性缩放功能不生效!bug记录!

    在本项目中使用的是这个echart库 在项目中添加了dataZoom配置项但是不生效,突然想到微信小程序代码大小的限制,之前的echarts.js是定制的,有可能没有加dataZoom组件。故重新定制echarts.js。之前用的echarts版本是5.0.0,这次也是定制同样的版本,但是报错,按照之前的经验判断,

    2024年02月11日
    浏览(50)
  • uniapp 开发微信小程序 中使用 custom-tab-bar创建自定义tabbar

    1.   目录结构必须按照如图所示,在src 目录下   2. index.js 3.  index.html 4.  wxss 5. index.json  按照微信官方文档,以及代码片段,需要在tabbar 页面中onshow生命周期内设置 tabbar 的选中状态,但是在 uniapp 创建的 页面中是 this 是不包含 getTabBar 方法的, 只有通过 this.$mp.page或者

    2024年02月10日
    浏览(34)
  • 解决使用uniapp开发微信小程序时主包太大和vendor.js过大无法打包的问题

    在uniapp开发小程序这一块,相信很多开发者都遇到过代码体积太大无法打包的问题,还有vendor.js过大无法打包。这时候就要优化小程序包大小。下面分享一下我在实际项目中使用的方法,并解决了相应的问题,这里是我的解决思路。小伙伴们也可以根据自身情况,参考一下。

    2024年02月11日
    浏览(79)
  • 微信小程序使用TCP通信

    最终目的:在微信小程序内实现对局域网发起TCP通信 实现步骤:建立TCP服务 + 小程序发起通信 建立TCP服务 第一步:引入net模块(http模块是基于net模块之上的) 第二步:新建TCP服务,同时进行各种生命周期事件的监听 第三步:开启TCP服务 小程序发起通信 注意: 微信小程序

    2024年02月03日
    浏览(26)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包