H5使用jsonp解决调用腾讯地图Api跨域问题

在H5中使用腾讯地图Api的时候，一般情况下我们直接使用都会出现跨域的情况出现，我们可以使用vue-jsonp解决我们的跨域问题；

1.首先在自己的项目中使用npm安装vue-jsonp；

npm install vue-jsonp

2.在自己需要进行解决跨域的页面引入vue-jsonp;以下是我在项目中对经纬度进行地址逆向解析的例子。

import {jsonp} from 'vue-jsonp'

    /**
     * 地理坐标地址逆向解析
     * @param val 包含经纬坐标
     */
    getUserLocation(val:any) {
      let url = 'https://apis.map.qq.com/ws/geocoder/v1/';
      let data={
        location: val.location.lat+','+val.location.lng,
            key: this.mapKey,
            get_poi:0,
            output:'jsonp'
      };
      //使用jsonp解决跨域问题
      jsonp(url,data).then(data=>{
        this.processReverseAddressData(data.result);
      }).catch(err=>{
        console.log(err,'获取地理位置错误')
      })
    }