uniapp解决H5引入腾讯地图跨域问题

一、申请腾讯地图key

进入腾讯地图开放平台

二、引入腾讯地图

1. 安装 vue-jsonp

npm install --save vue-jsonp

 2.在 main.js 中使用

import { VueJsonp } from 'vue-jsonp';
Vue.use(VueJsonp);

 

3.获取定位

// 获取当前位置
let that = this
uni.getLocation({
	type: 'wgs84',
	success: function (res) {
	    that.location = res.latitude+','+res.longitude
		console.log(that.location)
		let url = 'https://apis.map.qq.com/ws/geocoder/v1/?address=';
		that.$jsonp(url, {
			key: key,
			location: that.location,
			output: 'jsonp'
		}).then(res => {
			console.log(res)
			}).catch(err => {
				console.log(err);
			});
		},fail(err){
			console.log(err)
		}
	});

4、配置文件填写地图key 

manifest.json--web配置--腾讯地图填写key

5.运行结果