Cordova/Phonegap 在 Cordova 主 web 視圖中加載外部站點

Question

我想要的是

我有外部網絡資源，我希望科爾多瓦 webview 能夠簡單地打開並能夠通過其內部導航進行導航。

描述

InAppBrowser 文檔說

InAppBrowser 窗口的行為類似於標准 Web 瀏覽器，無法訪問 Cordova API。 因此，如果您需要加載第三方（不受信任）內容，而不是將其加載到 Cordova 主Web 視圖中，建議使用 InAppBrowser

所以我有一個受信任的外部鏈接（假設http://www.google.com我想在主 webview 中加載並希望通過 window.location.href 或用戶鏈接單擊來控制其進程。

我試過的

使用最新的科爾多瓦生成 hello world 應用程序並插入

window.location.href = 'http://www.google.com/'

到它的 onDeviceReady。 它的配置已經有了（我試圖將其更改為具體地址）

<access origin="*" />

我也嘗試了 window.open 和手動用戶鏈接點擊，但我所擁有的只是在外部瀏覽器中打開鏈接的對話框，而不是在同一個 webview 中呈現它。 我還嘗試了 InAppBrowser 擴展，當我禁用導航欄時它工作正常，但它存在通信問題並且不適用於手動鏈接舔和 window.location.href 更改。

Answer 1

在ios和android上使用以下規則解決了這個問題：

<access origin="*" />
<allow-navigation href="*" />
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="tel:*" />
<allow-navigation href="sms:*" />
<allow-navigation href="mailto:*" />
<allow-navigation href="geo:*" />

如果你遇到同樣的問題，你還需要知道以下內容：

• 當docs對於當前版本並不總是正確時，多個cordova版本具有不同的規則結構和行為。 在我的研究中，我發現這篇文章非常有用https://github.com/jessemonroy650/top-phonegap-mistakes/blob/master/whitelist-matrix.md
• 我的主要問題是“不知道”允許意圖覆蓋允許導航。 確保你了解它是如何工作的

Answer 2

如何將www.example.com加載到 Cordova WebView？

    <allow-navigation href="https://example.com/*" />
    <allow-navigation href="*://*.example.com/*" />

更多信息：

AFAIK 默認情況下 Cordova 不允許在 WebView 上加載外部鏈接。 但是，您仍然可以顯示存儲在項目中的內部 html 頁面（例如 index.html 等）。 這是一種安全措施。

因此，您需要安裝此插件cordova-plugin-whitelist並手動將您的應用想要加載到 Cordova WebView 的域列入白名單。

如果你想讓所有的鏈接在 WebView 中加載，你可以使用<allow-navigation href="*" />但不推薦。

相關鏈接：

官方 Github 鏈接