如何在没有互联网连接时阻止gmap

我使用PrimeFaces组件gmap，以便能够使用Google地图服务。它适用于我，但我有一个问题。当没有互联网连接时，我的用户界面完全被阻塞。有没有办法解决这个问题，如果没有互联网连接，不要渲染gmap？这是我的代码：如何在没有互联网连接时阻止gmap

<p:gmap id="geoGmap" widgetVar="geoMap" center="#{managedBean.centerGeoMap}" zoom="15" type="ROADMAP" model="#{managedBean.geoModel}" style="width:1000px;height:500px" streetView="false" disableDefaultUI="true" > 
    <p:ajax event="geocode" listener="#{managedBean.onGeocode}" update="@this" /> 
</p:gmap>

这里是脚本导入它：

<script src="https://maps.google.com/maps/api/js?sensor=false" type="text/javascript" ></script>

来源

2016-09-28 Billy Hope

您的用户如何访问您的应用程序？它在Intranet上吗？ –

用户通过企业网络访问应用程序 –

您的应用程序是否从同一网络托管？ –

当没有互联网连接，我的用户界面完全被封锁

这是由JavaScript错误引起的。您可以在浏览器的开发人员工具集中查看JavaScript控制台时看到它。在Chrome/FF23 +/IE9 +中按F12查看。

Uncaught ReferenceError: google is not defined

在Chrome中，您可以展开堆栈跟踪。当单击第一行，它指的是在HTML源通过<p:gmap>生成的脚本，如下所示（空白手动插入用于可读性）：

<script id="geoGmap_s" type="text/javascript"> 
    $(function() { 
     PrimeFaces.cw('GMap', 'geoMap', { 
      id: 'geoGmap', 
      mapTypeId: google.maps.MapTypeId.ROADMAP, // <-- Here, 
      center:new google.maps.LatLng(...),  // <-- and here. 
      ... 
     }); 
    }); 
</script>

看，此联脚本是试图取消引用变量google这是应该放在Google Maps API JavaScript文件的窗口范围内。但是，如果没有互联网连接，那么Google Maps API JavaScript文件无法加载，因此在窗口范围内将不会有google变量，因此此<p:gmap>生成的脚本将引发错误，指出变量google未定义。

当JavaScript上下文中存在未处理的错误时，JavaScript执行将完全停止。换句话说，剩下的脚本，例如其他PrimeFaces用户界面组件，其功能严重依赖于JavaScript，完全不会被执行。这解释了你对“我的用户界面完全被阻止”的观察。

从技术上讲，解决方案非常简单：当变量google不在窗口范围内时，<p:gmap>不应尝试执行该脚本。

为了实现这一点，你需要延长的<p:gmap>渲染器，该GMapRenderer，脚本启动后直接写一个if (window.google)：

public class YourGMapRenderer extends GMapRenderer { 

    @Override 
    protected void startScript(ResponseWriter writer, String clientId) throws IOException { 
     super.startScript(writer, clientId); 
     writer.write("if(window.google)"); 
    } 

}

为了得到它的运行，其注册在faces-config.xml其中<renderer-class>代表您的扩展渲染器类的FQN以下为：

<render-kit> 
    <renderer> 
     <component-family>org.primefaces.component</component-family> 
     <renderer-type>org.primefaces.component.GMapRenderer</renderer-type> 
     <renderer-class>com.example.YourGMapRenderer</renderer-class> 
    </renderer> 
</render-kit>

一旦安装，它会改变渲染的脚本如下：

<script id="geoGmap_s" type="text/javascript"> 
    if (window.google) $(function() { 
     PrimeFaces.cw('GMap', 'geoMap', { 
      ... 
     }); 
    }); 
</script>

换言之，该函数将仅当window.google是truthy调用时，即当google变量是在JavaScript的窗口范围可用。

这应该避免JS错误，并让JS执行继续。

来源

2016-10-01 20:39:52 BalusC

如何在没有互联网连接时阻止gmap

回答

相关问题