cordova InAppBrowser 打开远程页面支持调用本机方法？答案

【问题标题】：cordova InAppBrowser open remote page suport call native method?cordova InAppBrowser 打开远程页面支持调用本机方法？
【发布时间】：2019-02-27 08:35:03
【问题描述】：

尝试在 cordova 中打开远程页面时遇到问题。

我尝试使用InAppBrowser插件打开远程页面不调用本机方法。

我查看了官方文档。 InAppBrowser 不允许访问本地方法，但我需要实现这个功能。

您能否帮助我了解如何做到这一点或获得解决方法？

【问题讨论】：

标签： cordova cordova-plugins inappbrowser

【解决方案1】：

this PR 已将postMessage API 的模拟添加到适用于 Android 和 iOS 的 cordova-plugin-inappbrowser，这使您可以将加载到 InappBrowser Web 视图中的页面中的消息发布回运行应用程序的主 Cordova Web 视图.使用它可以让您从加载到 InappBrowser 的页面调用应用程序中的“本机方法”。

latest release version on npm (v3.0.0) 中还没有此功能，因此您需要直接从 Github 主分支 (v3.1.0-dev) 安装插件：

cordova plugin add https://github.com/apache/cordova-plugin-inappbrowser

在您的 Cordova 应用程序代码中，您将添加代码以侦听来自 InappBrowser 的消息，例如：

var inAppBrowserRef = cordova.InAppBrowser.open("http://www.mypage.com", "_blank");
inAppBrowserRef.addEventListener("message", function (params){
    if(params.data.action === "myNativeMethod"){
        // Call your native method
        myApp.myNativeMethod();
    }
});

然后在加载到 InappBrowser 的网页中，您将发送消息：

<button id="myButton">Press me</button>
<script type="text/javascript">
    document.getElementById("myButton").addEventListener("click", function(){
        var message = {action: "myNativeMethod"};
        webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify(message));
    }, false);
</script>

如果您无法直接控制正在加载到 InappBrowser 的页面，您可以注入代码来发送消息：

inAppBrowserRef.executeScript({ 
    code: '\
        document.getElementById("myButton").addEventListener("click", function(){\
            var message = {action: "myNativeMethod"};\
            webkit.messageHandlers.cordova_iab.postMessage(JSON.stringify(message));\
        }, false);\
    '
});

【讨论】：

谢谢你的回答，但这并没有解决我的问题。可能我描述的不够清楚。我需要通过InAppBrowser打开远程webApp，webApp可以调用本地插件。
在 InappBrowser 中运行的 web 应用程序不能直接调用 Cordova 应用程序中存在的本地插件 - Webviews 是完全独立的。我所描述的机制是 InappBrowser 中的页面可以调用 Cordova 应用程序 Webview 中的代码的唯一方式。除非您将远程 webapp 直接加载到 Cordova Webview 中，否则这是个坏主意。
我修改了“InAppBrowser”插件的底层代码，使其能够访问其他cordova插件。但是你不能得到调用插件的结果。
按照你的方式，远程webApp能否调用所有已安装的插件并远程返回正确的回调结果？
postMessage API 是单向的。如果要返回插件结果，可以使用 injectScript 将其插入 InappBrowser 页面。