实现在微信小程序中从index.js使用mqtt通信协议接收服务器数据，在提取出经纬度的数据发送到地图里，实现实时更新定位

代码如下：

index.js

const app = getApp()

var mqtt = require('../../utils/mqtt.min.js') //根据自己存放的路径修改

const appInstance = getApp();

Page({

  data: {

    motto: 'Hello World',

    userInfo: {},

    hasUserInfo: false,

    canIUse: wx.canIUse('button.open-type.getUserInfo'),

    canIUseGetUserProfile: false,

    canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName'), // 如需尝试获取用户信息可改为false

    temperture:'0',

    humidity:'0',

    angle:'0',

    wl:'0',

    gas:'0',

    longitude:'0',

    latitude:'0'

  },

  onLoad(){

    this.doConnect()

    if (wx.getUserProfile) {

      this.setData({

        canIUseGetUserProfile: true

      })

    }

    this.setData({

        nbTitle: '设备参数',

        nbLoading: false,

        nbFrontColor: '#ffffff',

        nbBackgroundColor: '#D53e37',

      })

  },

   doConnect(){

    //如果你服务器开了连接验证，这里的参数要自己加上username和password等

    const options = {

      keepalive: 60, //60s

      clean: true, //cleanSession不保持持久会话

      protocolVersion: 4 ,//MQTT v3.1.1

      clientId:Math.random().toString(36).substr(2)

    };

    let url = "wx://www.visionexpand.com.cn:8083/mqtt";//这个地址是emq官方的公开免费地址，请换成自己服务器的地址

    const client = mqtt.connect(url,options)

    client.on('connect', function () {

      console.log('连接emqx服务器成功')

      client.subscribe('$thing/up/property/IQMPOB8BI9/temp/humi',{qos:2},function(err){

        if(!err)

            {console.log('订阅成功')}

      })

    })

    //接收消息监听

    client.on('message', (topic, message) => { 

        

      let msg=message.toString();

      const data=JSON.parse(msg);

       const timestamp = new Date().toISOString().substr(0, 19).replace('T', ' ');  

      console.log('温度：', data.temperture, '湿度：', data.humidity,'纬度：',data.longitude,'经度',data.latitude); 

  // 设置数据

  this.setData({  

    temperture: data.temperture,  

    humidity: data.humidity,

    longitude:data.longitude,

    latitude:data.latitude

  });

  appInstance.globalData.sharedLocation = {  

    latitude: data.latitude,  

    longitude: data.longitude 

  };

  app.emitGlobalEvent('mqttDataUpdatedWithTime', updatedData)

  })

},

    });  

  }

})

map.js

const appInstance = getApp();

// pages/map/map.js

Page({

  data: {

     subKey:'AQDBZ-4UU6L-BZEP3-MNGFF-CH7G5-MXB4O',

     enable3d:true,

     showLocation:true,

     showCompass:true,

     showscale:true,

     enableOverlooking:false,

     enableZoom:true,

     enableRotate:false,

     drawPolygon:false,

     enableSatellite:false,

     enableTraffic:false,    

     latitude:'',

     longitude:'',

     nbFrontColor: '#000000',

     nbBackgroundColor: '#ffffff',

     markers:[],

     circles:[],

     polylines:[],

     polygons:[]

  },

  buttonSearch(e){

    //通过wx.request发起HTTPS接口请求

    wx.request({

      //地图WebserviceAPI地点搜索接口请求路径及参数（具体使用方法请参考开发文档）

      url: 'https://apis.map.qq.com/ws/place/v1/search?page_index=1&page_size=20&boundary=region(22.556992,113.970473)&keyword=美食&key=AQDBZ-4UU6L-BZEP3-MNGFF-CH7G5-MXB4O',

  })

},

  onLoad: function () {

    this.getFuzzyLocation();

    this.setData({

        nbTitle: '地图查看',

        nbLoading: false,

        nbFrontColor: '#ffffff',

        nbBackgroundColor: '#D53e37',

    })

  },

  getFuzzyLocation: function (message) {

   const sharedLocation = appInstance.globalData.sharedLocation;  

      const marker = {  

        id: 1, // 标记的id，可以根据需要设置  

        latitude: sharedLocation.latitude, // 纬度  

        longitude: sharedLocation.longitude // 经度

      };  

      this.setData({  

        markers: [marker], // 设置markers数组，只包含一个标记  

        latitude: sharedLocation.latitude, // 可选：更新页面数据中的纬度值  

        longitude: sharedLocation.longitude, // 可选：更新页面数据中的经度值  

      });

      // 在这里你可以使用这些经纬度数据，比如更新地图视图等。  

    }

  })

app.js

App({

  globalData: {  

    sharedLocation: null

  }, 

  // onGlobalEvent函数：用于注册全局事件的处理函数  

onGlobalEvent: function(eventName, callback) {  

    // 如果当前对象没有globalEventHandlers属性（即还没有注册过任何事件），则初始化它为一个空对象  

    if (!this.globalEventHandlers) {  

      this.globalEventHandlers = {};  

    }  

    // 如果在globalEventHandlers对象中，指定的eventName事件还没有对应的处理函数数组，则初始化它为一个空数组  

    if (!this.globalEventHandlers[eventName]) {  

      this.globalEventHandlers[eventName] = [];  

    }  

    // 将传入的callback（处理函数）添加到指定eventName的事件处理函数数组中  

    this.globalEventHandlers[eventName].push(callback);  

  },  

  

// emitGlobalEvent函数：用于触发全局事件，并调用所有注册在该事件上的处理函数  

emitGlobalEvent: function(eventName, data) {  

    // 如果当前对象有globalEventHandlers属性，并且该属性中有指定的eventName事件，则执行以下操作  

    if (this.globalEventHandlers && this.globalEventHandlers[eventName]) {  

      // 遍历指定eventName事件的处理函数数组  

      this.globalEventHandlers[eventName].forEach(function(handler) {  

        // 调用每一个处理函数，并传入data参数  

        handler(data);  

      });  

    }  

  },

})