vue中如何正确使用mqtt?

Question

vue created()：

chrom控制台中输出了mqtt对象，但随后的函数似乎没有执行

命令行中只有外部js文件写的publish的连接信息

publish.js

Answer 1

已解决，客户端用的mqtt.js以websocket的形式向服务器发送数据，服务器需要相应配置来接收发过来的socket内容。
另外：特地写了两篇关于mqtt的博客,记录了完整的实现过程
https://segmentfault.com/a/11...
https://segmentfault.com/a/11...

Answer 2

我用vue 写的

import '@/util/mqttws31'

export default {
  name: "app",
  data() {
    return {
      client: new Paho.MQTT.Client('172.29.144.22', 61623, "web_"+ parseInt(Math.random() * 100, 10)), // 第三个参数是clientID可以为空
      topic: 'DeviceDataTopic' // 订阅的主题
    };
  },
  watch: {},
  created() {
    console.log('ddddddddddddddddd')
    // let client = new Paho.MQTT.Client('172.29.144.22', 61623, "web_"+ parseInt(Math.random() * 100, 10))// 第三个参数是clientID可以为空
    let options = {timeout : 3,useSSL:false,cleanSession:true,onSuccess: this.onConnect,onFailure: this.onFailure}
    // this.client.connect({onSuccess: this.onConnect,onFailure: this.onFailure}); // 连接服务器并注册连接成功处理事件
    this.client.connect(options)
    this.client.onConnectionLost = this.onConnectionLost // 注册连接断开处理事件
    this.client.onMessageArrived = this.onMessageArrived // 注册消息接收处理事件
  },
  methods: {
    onConnectionLost: function (responseObject) {
      if (responseObject.errorCode !== 0) {
        console.log('onConnectionLost:' + responseObject.errorMessage);
        console.log('连接已断开');
      }
      setTimeout(this.onConnect, 2000);
    },
    onMessageArrived: function(message) {
      console.log("收到消息:"+message.payloadString);
    },
    onConnect: function() {

      console.log('onConnected');
      this.client.subscribe(this.topic); // 订阅主题
    },
    onFailure:function(){
      console.log("连接失败: " + message.errorMessage + "Retrying");
      setTimeout(this.onConnect, 2000);
    }
  },
  computed: {}
};

报错

app.js:161015 Uncaught ReferenceError: Paho is not defined
    at Object../src/util/mqttws31.js (app.js:161015)
    at __webpack_require__ (app.js:660)
    at fn (app.js:86)
    at Object../node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue (app.js:3599)
    at __webpack_require__ (app.js:660)
    at fn (app.js:86)
    at Object../src/App.vue (app.js:156133)
    at __webpack_require__ (app.js:660)
    at fn (app.js:86)
    at Object../src/main.js (app.js:158376)

怎么破