使用Cordova webview

2018-06-28 13:26:56

我想知道，对于使用Cordova进行移动开发，是否有办法打开远程Web应用程序，并且当在远程Web应用程序中单击按钮时，它会在Cordova环境中执行Java脚本？

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

如果用户单击“接受”，我希望运行一个JavaScript，可以在移动应用程序中为用户继续使用移动应用程序启动另一个页面。

这可能吗？

谢谢！

首先，为了正常运行，使用完全依赖远程服务器的移动应用程序并不是一个好主意：如果用户的互联网连接断开或间歇，该怎么办？（发生在我住的地方很多）。

但是，一种解决方案是使用iframe加载远程web应用程序内容和跨帧消息，将远程web应用程序的UI交互结果传回给您的Cordova应用程序。您必须将您的远程Web应用程序网址列入适当的白名单。

像这样的东西：

Cordova app index.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>

远程webapp 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>

链接地址: http://www.djcxy.com/p/79775.html

上一篇: Using Cordova webview

下一篇: Cordova: judge whether the page is opened in a device app