Question

我在Visual Studio 2015中使用Cordova的InAppBrowser插件。是否可以在应用程序中运行此浏览器？目前，我的代码在Edge的新实例中启动了URL：

我正在用以下内容替换window.open：

function onDeviceReady() {
    window.open = cordova.InAppBrowser.open;
};

我正在使用以下内容启动网址：

ref = window.open(
    url,
    '_system',
    'location=no,hidden=yes');

拥有_system似乎会导致Edge的新实例打开。如果我使用其他任何东西（例如_self，_blank），我会收到以下错误：

The app can’t use script to load the (URL here) url because the url launches another app. Only direct user interaction can launch another app

我希望在应用程序中运行浏览器，以使旅程无缝。

谢谢。

Answer 1

这是我的解决方案。

我已经拿到了3分：

需要jQuery mobile，否则我会出现空白屏幕
定位_blank以绑定loadstop。使用_self破坏了loadstop事件。
需要以下CSS类来确保InAppBrowser在Windows设备上没有大量边框
```
.inAppBrowserWrap {
    border: 0 !important;
}
```

为了清楚起见，我已经截断了一些代码。

HTML

<!DOCTYPE html>
    <html>
    <head>        
        <meta name="format-detection" content="telephone=no">
        <meta name="msapplication-tap-highlight" content="no">
        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
        <link rel="stylesheet" type="text/css" href="css/index.css">
        <title>BlankCordovaApp1</title>

        <script type="text/javascript" src="cordova.js"></script>
        <script type="text/javascript" src="scripts/platformOverrides.js"></script>
        <script type="text/javascript" src="scripts/jquery-mobile/scripts/jquery-1.8.0.min.js"></script>
        <script type="text/javascript" src="scripts/jquery-mobile/scripts/jquery.mobile-1.4.5.min.js"></script>
        <script type="text/javascript" src="scripts/index.js"></script>

    </head>
    <body>
        <div id="MainContent">
            <label>Login here</label>
            <input type="text" id="txtUserName" />
            <input type="text" id="txtPassword" />
            <button type="button" id="btnLogin">Login</button>
            <div id="Message">
            </div>
        </div>
    </body>
</html>

JS

(function (){
   "use strict";

    var ref = null;
    var apiUrl = 'http://192.168.1.3:3000/Api/MobileLogin';

    document.addEventListener('deviceready', onDeviceReady.bind(this), false);

    function onDeviceReady() {
        window.open = cordova.InAppBrowser.open;

        document.getElementById('btnLogin').addEventListener('click', login);
    };

    function login() {
        // disable login button
        var loginButton = this;
        loginButton.disabled = true;

        $.ajax({
            url: apiUrl,
            type: 'post',
            data: { Email: $('#txtUserName').val(), Password: $('#txtPassword').val() },
                success: function (url) {
                    LaunchBrowser(url);

                // re-enable the button
                loginButton.disabled = false;
            }
        });
    };

    function LaunchBrowser(url) {

       // _blank must be used in order for loadstop to trigger
        ref = window.open(
            url,
            '_blank',
            'location=no,hidden=no');

        ref.addEventListener('loadstop', function (e) {
            if (e.url.match('MobileClose')) {
                ref.close();
            }
        });

    };

})();

Web API会返回要使用令牌命中的移动设备的URL（1分钟后过期）。这会记录用户并设置会话变量“OnMobile”。

当用户通过网络注销时，用户被重定向到“MobileClose”，因为“OnMobile”为真。这告诉应用程序关闭InAppBrowser。

可以在App中使用Cordova Windows Phone通用InAppBrowser吗？

1 个答案: