腾讯地图对接一些坑

545 阅读1分钟

1.老接口2024年6月停止维护, 解决方案可以参考:www.cnblogs.com/herewang/p/…

image.png

2.如果用到上面的地址解析跟逆地址解析api,需要处理跨域问题。
解决方案可以参考使用jsonp的模式,建议不要使用vue自带的代理。
  1. npm install jsonp --save
  2. import jsonp from 'jsonp';
getReverseGeocoding(latLng) {
      console.log('latLng: ', latLng)
      const lat = latLng.lat || 21.509042
      const lng = latLng.lng || 114.940808
      const url = `https://apis.map.qq.com/ws/geocoder/v1/?location=${lat},${lng}&output=jsonp&key=你的key
  
  jsonp(url, null, (error, data) => {
    console.log("data: ", data);
      if (error) {
        this.$message.error('请求逆地址解析失败');
        console.error(error);
        return;
      }
      if (data.status === 0) {
          const result = data.result
          
      } else {
        this.$message.error('逆地址解析失败');
      }
    });
     
    },

3.腾讯的地址解析api必须精准查询,比如要输入城市名称! 参考api地址:lbs.qq.com/service/web…

image.png

image.png