试图围绕 Paho MQTT Javascript 客户端编写一个包装类答案

【问题标题】：Trying to write a wrapper class around Paho MQTT Javascript client试图围绕 Paho MQTT Javascript 客户端编写一个包装类
【发布时间】：2020-09-11 13:21:39
【问题描述】：

我正在尝试围绕 Paho MQTT JavaScript 客户端编写一个简单的包装类。（这个想法是围绕 MQTT 消息传递一些额外的验证，以确保以正确的顺序处理消息。）

我对 JavaScript 类不太满意，而且我在试图找出其中的问题时一团糟……

class Hermes {
  constructor(uri, topic, callback) {
    var clientId = "clientID_" + parseInt(Math.random() * 1000);
    this.client = new Paho.MQTT.Client(uri, clientId);
    this.topic = topic;
    this.callback = callback;
    this.client.onMessageArrived = this._onMessageArrived;
    this.client.onConnectionLost = this._onConnectionLost;
    this.client.connect({
      onSuccess: this._onConnect,
      onFailure: this._onFailure
    });
  }
  _onConnect() {
    // Once a connection has been made, make a subscription and send a message.
    console.log("_onConnect: " + this.client.clientId)
    this.client.subscribe(this.topic);
  }
  // called when connection fails
  _onFailure(responseObject) {
    console.log("_onFailure: "+responseObject.errorMessage);
  }
  // called when a message arrives
  _onMessageArrived(message) {
    console.log("_onMessageArrived: "+message.payloadString)
    // TODO: validate message and pass to callback
  }
  // called when client loses connection
  _onConnectionLost(responseObject) {
    if (responseObject.errorCode !== 0) {
      console.log("onConnectionLost: "+responseObject.errorMessage);
    }
  }
}


function handleMessage(message) {
// TODO: handle message
}
var hermes = new Hermes("ws://mqtt.example.com:9001/mqtt", "test", handleMessage);

预期结果： _onConnect: clientID_xxx 客户端连接成功后应该会在控制台登录。

实际结果：

onConnectionLost: AMQJS0005E Internal error. Error Message: undefined is not an object (evaluating 'this.client.clientId'), Stack trace: _onConnect@file:///Users/richardguy/Desktop/hermes.js:16:45

MQTT 代理在 VPS 上运行，我可以使用类外的 Paho Javascript 库成功发布/订阅消息，就像这样...

uri = "ws://mqtt.example.com:9001/mqtt"
var clientId = "clientID_" + parseInt(Math.random() * 1000);
client = new Paho.MQTT.Client(uri, clientId);
client.onConnectionLost = onConnectionLost;
client.onMessageArrived = onMessageArrived;
client.connect({
  onSuccess: onConnect,
  onFailure: onFailure
});
function onConnect() {
  // Once a connection has been made, make a subscription and send a message.
  console.log("_onConnect: " + client.clientId)
  client.subscribe("test");
}
// called when connection fails
function onFailure(responseObject) {
  console.log("_onFailure: "+responseObject.errorMessage);
}
// called when a message arrives
function onMessageArrived(message) {
  console.log("_onMessageArrived: "+message.payloadString)
  // TODO: validate message and pass to callback
}
// called when client loses connection
function onConnectionLost(responseObject) {
  if (responseObject.errorCode !== 0) {
    console.log("onConnectionLost: "+responseObject.errorMessage);
  }
}

这只是类定义中的错误，还是与 Paho MQTT 库有关？？

解决方案：

我需要传递一个对象（在本例中为 Hermes 类的实例）以用作 onSuccess 回调的上下文，而不是使用 this（这不是我想的那样，像往常一样...），在连接选项中使用invocationContext。

class Hermes {
  constructor(uri, topic, callback) {
    var clientId = "clientID_" + parseInt(Math.random() * 1000);
    this.client = new Paho.MQTT.Client(uri, clientId);
    this.topic = topic;
    this.callback = callback;
    this.client.onMessageArrived = this._onMessageArrived;
    this.client.onConnectionLost = this._onConnectionLost;
    this.client.connect({
      onSuccess: this._onConnect,
      onFailure: this._onFailure,
      invocationContext: this
    });
  }
  _onConnect(responseObject) {
    // Once a connection has been made, make a subscription and send a message.
    let self = responseObject.invocationContext;
    self.client.subscribe(self.topic);
  }
  // called when connection fails
  _onFailure(responseObject) {
    console.log("_onFailure: "+responseObject.errorMessage);
  }
  // called when a message arrives
  _onMessageArrived(message) {
    console.log("_onMessageArrived: "+message.payloadString)
    // TODO: validate message and pass to callback
  }
  // called when client loses connection
  _onConnectionLost(responseObject) {
    if (responseObject.errorCode !== 0) {
      console.log("onConnectionLost: "+responseObject.errorMessage);
    }
  }
}


function handleMessage(message) {
}
var hermes = new Hermes("ws://mqtt.example.com:8080/mqtt", "test", handleMessage);

【问题讨论】：

标签： javascript websocket mqtt paho

【解决方案1】：

你的问题是 this 不是你想的那样。

回调都是由客户端网络处理程序产生的，所以this实际上是对处理程序的引用。

您可以在使用invocationContext 的连接选项中传递一个对象以用作onSuccess 和onFailure 回调的上下文，但不能用于其他回调。

【讨论】：