解决在纯政务网使用高德地图 项目访问不了的问题

背景:

        在项目中使用高德地图时 ,环境是互联网是没有任何问题。一旦项目在纯政务网使用项目就会报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")};  // 按需引入高德地图

解决在纯政务网使用高德地图 项目访问不了的问题_第1张图片

解决在纯政务网使用高德地图 项目访问不了的问题_第2张图片 

 

你可能感兴趣的:(javascript,前端)