微信小程式整合MQTT

參考：

杭州一家公司開發的emqx，部署非常簡單，功能強大。目前評估了免費版本功能還夠用。

乙個非常強大的千星+的mqtt js客戶端,

github:

很貼心還提供了cdn:

web伺服器，本文用於反向**。

使用linux的朋友推薦wxdt,體驗非常不錯，記得裝wine,不然是沒法除錯的。

開發環境把"不要驗證網域名稱..."勾上，繞開雲伺服器,網域名稱，證書這些部署才需要的東西。

//乙個全域性變數...

var client = null;

注意：實測以下配置僅在模擬器中或ios真機中有效，對於android真機並不起作用。

重點注意一下options裡面的那個port，估計若是沒人告訴你得撲騰一會。mqtt.js缺省會通過443埠建立web socket連線，如果你像我一樣用的是emqx那麼你需要指定埠。

協議用wx(ws)就好了，畢竟實在開發機除錯用的先別搞那麼複雜的。

connectmqtt: function

() 
client = mqtt.connect('wx:///mqtt', options)
client.on('reconnect', (error) =>)
client.on('error', (error) =>)
let that = this
; client.on('connect', (e) =>, 
function
(err) 
})})
client.on('message', function
(topic, message) )
},

client.publish('message.queue', 'hello mqtt')

如果配置無誤那麼點選connect按鈕會顯示已連線。

注意：實測以下配置僅在模擬器中或ios真機中有效，對於android真機並不起作用。

emqx預設wss埠為8084，把之前的8083改為8084。

把ip位址換成網域名稱，必須備案。

上線需要使用wss協議，所以這裡把伺服器協議改為wxs(wss,wxs的mqtt.js定的別問我)。

connectmqtt: function

() 
client = mqtt.connect('wxs:///mqtt', options)
client.on('reconnect', (error) =>)
client.on('error', (error) =>)
let that = this
; client.on('connect', (e) =>, 
function
(err) 
})})
client.on('message', function
(topic, message) )
},

server .cn;

listen 443 ssl;
ssl_certificate .pem;
ssl_certificate_key .key;
ssl_session_timeout 5m;
ssl_protocols tlsv1 tlsv1.1 tlsv1.2;
ssl_ciphers ecdhe-rsa-aes128-gcm-sha256:high:!anull:!md5:!rc4:!dhe;
ssl_prefer_server_ciphers on;
location /mqtt 
}

connectmqtt: function() 

client = mqtt.connect('wxs:///mqtt', options)
client.on('reconnect', (error) => )
client.on('error', (error) => )
let that = this;
client.on('connect', (e) => , function(err) 
})})
client.on('message', function (topic, message) )
},

（微信小程式）一 初識微信小程式

需要看的 先是檔案目錄 一 pages 他存放於多個頁面 如 index log頁面。可以把他裡面的每個資料夾看成乙個整體。這個整體存放著 html css 和 資料 1 index資料夾 存放的index頁面的目錄。2 index.js 他可以處理得到 ajax 或自定義定義的資料。把得到的值封裝...

微信小程式

2.單獨設定某一頁面下的頂部欄的背景顏色,在其對應的.json檔案下修改即可 3.this.setdata 注意 onload函式下面執行的是非同步操作，非同步操作裡面this.data.直接賦值，是無效的，必須使用this.setdata this.setdata msg he llo wor l...

微信小程式

你好！這是你第一次使用markdown編輯器所展示的歡迎頁。如果你想學習如何使用markdown編輯器,可以仔細閱讀這篇文章，了解一下markdown的基本語法知識。全新的介面設計，將會帶來全新的寫作體驗 在創作中心設定你喜愛的 高亮樣式，markdown將 片顯示選擇的高亮樣式進行展示 全新的ka...