如何在cordova项目中异步打开inappbrowser

Posted 2023-05-07

【中文标题】如何在cordova项目中异步打开inappbrowser

【英文标题】：how to open inappbrowser asynchronously in cordova project

【发布时间】：2016-09-22 12:49:50

【问题描述】：

我正在 phonegap cordova 中创建一个 android 应用程序，这里我正在使用 appbrowser 插件将网站转换为 webview。我的问题是在加载 inappbrowser 时它在应用程序中显示白屏，有什么办法可以避免这个空白屏幕。我有为应用设置闪屏，但对应用浏览器无效。

我可以通过以下一种方式解决问题

1)如果有任何方法可以将闪屏设置为inappbrowser

或

2）如果我能够异步加载应用程序浏览器，在加载期间我可以显示应用程序的闪屏

或

3)还有其他解决方案吗？

我使用了以下 javascript 代码

function onDeviceReady() 
    var url = 'http://www.mahadevaastro.com/bayarkart/';
    var target = '_blank';
    var options = "location=no,zoom=no"
    var option1 = "zoom=no"
    var ref = cordova.InAppBrowser.open(url, target, options);
   //   var ref = window.open(url, target, options, option1);

    ref.addEventListener('loadstart', loadstartCallback);
    ref.addEventListener('loadstop', loadstopCallback);
    ref.addEventListener('loadloaderror', loaderrorCallback);
    ref.addEventListener('exit', exitCallback);

    function loadstartCallback(event) 

        showSpinner();

    

    function loadstopCallback(event) 
        hideSpinner();
    

    function loaderrorCallback(error) 
        console.log('Loading error: ' + error.message)
    

    function exitCallback() 
        console.log('Browser is closed...')
    

    function showSpinner() 
        navigator.notification.activityStart("Bayar Speed Kart", "Its loading....");
        //  $.mobile.loading("show");
    

    function hideSpinner() 
        navigator.notification.activityStop();
        //$.mobile.loading("hide");
    

    // Handle the Cordova pause and resume events
    document.addEventListener( 'pause', onPause.bind( this ), false );
    document.addEventListener( 'resume', onResume.bind( this ), false );

    // TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
;

【参考方案1】：

曾经我也遇到过同样的问题，我解决问题的方法是在 loadstart 方法中加载 gif 图像

        ref.addEventListener("loadstart", function () 

        ref.executeScript(
           //  code: "document.body.style.backgroundColor = 'yellow';" ,
               code: "document.body.style.background = 'url(loading.png)';" ,
                // url("paper.gif");
           function (values) 
                //alert(values[0]);
            
        );
    );