背景:
在项目中使用高德地图时 ,环境是互联网是没有任何问题。一旦项目在纯政务网使用项目就会报AMap.js 加载错误,导致整个项目加载不出来。
解决:
按需引入
1.在index.html页面中判断网络(在head标签中使用)
//全局查看是否有外网
let netWorkFlag=true;
let flag=false;
//步骤一:创建异步对象
var ajax = new XMLHttpRequest();
//步骤二:设置请求的url参数,参数一是请求的类型,参数二是请求的url,可以带参数,动态的传递参数starName到服务端
ajax.open('get','https://webapi.amap.com/maps?v=2.0&key=2914b5c628e06c63caccd3c47d40d7be&plugin=AMap.GroundImage;');
//步骤三:发送请求
ajax.send();
//步骤四:注册事件 onreadystatechange 状态改变就会调用
ajax.onreadystatechange = function () {
if (ajax.readyState==4 &&ajax.status==200) {
console.log('请求成功')
netWorkFlag=true;
flag=true;
}else{
// console.log('请求失败')
if(!flag){
netWorkFlag=false;
}
}
}
2. 在使用高德地图的页面中按需引入地图
if(netWorkFlag){import("AMap")}; // 按需引入高德地图