如何在沒有互聯網連接時阻止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

回答

相關問題