使用 Cordova 网络视图



我希望找出,对于使用 Cordova 的移动开发,有没有办法打开远程 Web 应用程序,当在远程 Web 应用程序中单击按钮时,它会在 Cordova 环境中执行 Java 脚本?

例如,我的移动应用程序通过 Web 视图打开了应用程序服务器中托管的网页,要求用户确认他已阅读并接受许可证。用户需要点击网页上的"接受"或"不接受"。

如果用户点击"接受",我希望运行一个javascript,可以在移动应用程序中调出另一个页面,供用户继续使用移动应用程序。

这可能吗?

谢谢!

首先,拥有一个完全依赖远程服务器的移动应用程序来正常运行不是一个好主意:如果用户的互联网连接中断或间歇性怎么办?(这种情况在我住的地方经常发生)。

但是,一种解决方案是使用 iframe 加载远程 Web 应用程序内容和跨帧消息传递,以将与远程 Web 应用程序的 UI 交互结果传达回 Cordova 应用程序。您必须将远程 Web 应用程序 URL 适当地列入白名单。

像这样:

科尔多瓦应用索引.html

<html>
    <head>
        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript">
            function onDeviceReady(){
                window.addEventListener("message", onFrameMessage, false);
            }
            function onFrameMessage(event){
                var eventName = event.data[0];
                if(eventName === "terms_result"){
                    var accepted = event.data[1] == 1; // == will match 1 or "1"
                    if(accepted){
                        // Do something - e.g. change to homepage
                    }else{
                        // Do something else - e.g. display an error message
                    }
                }
            }
            document.addEventListener("deviceready", onDeviceReady);
        </script>
    </head>
    <body>
        <div data-role="page" id="terms">
            <iframe src="http://example.com/my/remote/webapp" style="border: 0; width: 100%; height: 100%"></iframe>
        </div>
        <div data-role="page" id="home">
            <!-- Your home page content -->
        </div>
    </body>
</html>

远程网页应用 html

<html>
    <head>
        <script type="text/javascript">
            function accept(result){
                window.parent.postMessage(["terms_result", result], "*");
            }
        </script>
    </head>
    <body>
        <button onclick="accept(1)">Accept</button>
        <button onclick="accept(0)">Not Accept</button>
    </body>
</html>