JavaScript の使用 MQTT 通信の進行

10358 ワード
mqtt javascript テキストリンク
MQTT は非常に便利な簡易通信規則です, 依然大部分的 MQTT ブローカー 都サポート websocket, 因此我們也もウェブ 頁で使用できる MQTT, 以下以下 MQTT.js 這個模範的例, 並以下 https://test.mosquitto.org/ 提供された MQTT ブローカーの例:

<html>
<head>
  <title>test Ws mqtt.js</title>
  <script src="https://unpkg.com/mqtt/dist/mqtt.min.js"></script>
</head>
<body>
<script>
  var client = mqtt.connect("ws://test.mosquitto.org:8080") // you add a ws:// url here
  client.on('connect', ()=>{
    console.log('connected.');
    client.subscribe("mee")
    client.on("message", function (topic, payload) {
      console.log(payload);
      console.log([topic, payload].join(": "));
      // client.end()
    });

    client.publish("mee", "hello");    
  });
</script>
</body>
</html>


  • 第 4 行是 MQTT.js 提供的 CDN , 你也可以儲存一份本機檔使用.
  • 第 8 回は、websocket 連載の MQTT ブローカーであり、test.mosquitto.org のページに説明があり、機密性がなく、承認されていない測定用のブローカーが 8080 通訊埠 を使用しています.
  • 第 9 行就は MQTT ブローカーに修正閱頻道、並および透過第 11 行註冊 message イベントの関数.
  • 第 16 行規則は特定の頻度の道路でのメッセージです.

    連接サポート wss の MQTT ブローカー



    我們測試的 test.mosquitto.org 網站も提供 wss 規約, ただし要変更用 8081 埠頭:

    var client = mqtt.connect("wss://test.mosquitto.org:8081");
client.on('connect', ()=>{
  console.log('connected.');
  client.subscribe("mee")
  client.on("message", function (topic, payload) {
    console.log(payload);
    console.log([topic, payload].join(": "));
    // client.end()
  });

  client.publish("mee", "hello");    
});


    p5.js Web Editor で測量できます.

    連接必要帳簿號密碼登入的 MQTT ブローカー



    MQTT ブローカーが帳簿秘密の登録を必要とする場合は、連接時にオプションを追加することもできます.

    let options = {
    username: 'rw',       // 可讀寫的測試帳戶
    password: 'readwrite' // 測試帳戶的密碼
}
var client = mqtt.connect(
    // test.mosquitto.org 的 wss 使用 8081 埠
    "wss://test.mosquitto.org:8081",
    options // 連接時指定選項登入
);
client.on('connect', ()=>{
  console.log('connected.');
  client.subscribe("mee")
  client.on("message", function (topic, payload) {
    console.log(payload);
    console.log([topic, payload].join(": "));
    // client.end()
  });

  client.publish("mee", "hello");    
});


    p5.js Web Editor で測量できます.

    API説明



    詳細は API でネット上で確認できます.
    • サーブレット,Filter,Listener呼び出し順序,ライフサイクルの実験解析
    android bitmap compress(画像圧縮)