柚子快報(bào)激活碼778899分享：微信小程序UDP通信
柚子快報(bào)激活碼778899分享：微信小程序UDP通信
前言
這是為了實(shí)現(xiàn)微信小程序通過UDP協(xié)議與ESP32或者任何下位機(jī)通信做的demo實(shí)驗(yàn)，本人也是第一次學(xué)習(xí)微信小程序，代碼也是網(wǎng)上找來拼湊的，我發(fā)現(xiàn)網(wǎng)上關(guān)于微信小程序UDP通信的完整例程幾乎沒有，因此來紀(jì)錄一下，算是一個(gè)小總結(jié)。廢話不多說，直接上代碼，這些代碼都是我測試成功過的，如果對你有幫助或啟發(fā)請點(diǎn)一個(gè)贊吧！
微信小程序效果圖
說明：首先要打開這個(gè)開關(guān)進(jìn)行UDP連接，連接成功會(huì)彈出那個(gè)灰色的提示框，然后點(diǎn)UDP發(fā)送即可發(fā)送數(shù)據(jù)到手機(jī)端。這里的IP地址簡單起見是寫死的。具體流程是在js中寫死手機(jī)的ip地址還有端口號(hào)（因?yàn)槭窃诩依?，所以手機(jī)和電腦都是連的同一個(gè)路由器，即局域網(wǎng)通信，網(wǎng)關(guān)就是路由器，查看手機(jī)里的wifi連接信息就可以知道你手機(jī)的ip），手機(jī)上下載一個(gè)網(wǎng)絡(luò)調(diào)試助手，這里我使用的是 卓嵐物聯(lián) （因?yàn)槲野俣鹊臅r(shí)候第一個(gè)彈出來的就是這個(gè)廣告，然后下載了感覺還不錯(cuò)，沒有廣告），然后手機(jī)設(shè)置一下ip（電腦端的）和端口號(hào)就可以正常通信了。
wxml代碼
js代碼
Page({
data: {
udpResData: '',
type_switch: '',
},
type_switch(e) {
var sw = e.detail.value
this.setData({
type_switch: sw
})
if (sw) {
// 新建udp實(shí)例
this.udp = wx.createUDPSocket()
// udp綁定本機(jī)
this.udp.bind(2233)
//打開開關(guān)后就開始進(jìn)行消息的接收
this.udp.onMessage(this.onUdpMessage)
//一個(gè)灰色的信息彈窗
wx.showToast({
title: '連接成功',
icon: 'none',
duration: 2000 //持續(xù)的時(shí)間
})
} else {
//關(guān)閉UDP連接
this.udp.close()
wx.showToast({
title: '關(guān)閉連接',
icon: 'none',
duration: 2000 //持續(xù)的時(shí)間
})
}
},
// 頁面加載完成事件由系統(tǒng)調(diào)用,一個(gè)頁面只會(huì)調(diào)用一次
onLoad: function () {
},
// 點(diǎn)擊處理事件,send是wxml中的按鈕事件的名稱
send: function (e) {
//獲取鍵值
var sw = this.data.type_switch
//判斷是否連接了UDP
if (!sw) //如果沒有連接就彈出消息對話框
{
wx.showToast({
title: '沒有連接UDP！',
icon: 'none',
duration: 2000 //持續(xù)的時(shí)間
})
} else {
// 向指定的 IP 和 port 發(fā)送消息
this.udp.send({
address: '192.168.31.115', //192.168.31.169，第一個(gè)是手機(jī)的IP，第二個(gè)是電腦端的ip
port: '2233',
message: '你好'
})
}
},
//將監(jiān)聽到的消息轉(zhuǎn)換為字符串，必須要轉(zhuǎn)換才能正常顯示，因?yàn)楸O(jiān)聽到的消息都是些二進(jìn)制的數(shù)組
newAb2Str:function (arrayBuffer) {
let unit8Arr = new Uint8Array(arrayBuffer);
let encodedString = String.fromCharCode.apply(null, unit8Arr),
decodedString = decodeURIComponent(escape((encodedString)));//沒有這一步中文會(huì)亂碼
return decodedString;
},
// UDP 接收到數(shù)據(jù)的事件處理函數(shù)，參數(shù)res={message,remoteInfo}
onUdpMessage: function(res) {
let receive_message=this.newAb2Str(res.message)
this.setData({
udpResData:receive_message
})
},
})
消息的監(jiān)聽是打開開關(guān)就開始監(jiān)聽了。
總結(jié)
大概就是這個(gè)樣子，看不懂的話推薦去搜 微信小程序javascript 入門，微信小程序的官方社區(qū)有人講，我覺得寫得挺好的，很容易入門，我也才學(xué)習(xí)小程序兩天，所以難免會(huì)有錯(cuò)誤，如果有錯(cuò)的話請?zhí)嵝眩?/p>
柚子快報(bào)激活碼778899分享：微信小程序UDP通信
相關(guān)鏈接
本文內(nèi)容根據(jù)網(wǎng)絡(luò)資料整理，出于傳遞更多信息之目的，不代表金鑰匙跨境贊同其觀點(diǎn)和立場。
轉(zhuǎn)載請注明，如有侵權(quán)，聯(lián)系刪除。
Newegg科技出海星
