科尔多瓦网络视图显示白色屏幕，而不是加载微调框

编程问答 2022-06-11

问题描述

我是Cordova的新手，正在尝试在Android应用加载WebView（通过Inappbrowser调用）时显示微调框。 ShAkKiR here于几年前提供了Java语言微调器代码示例，我正在尝试利用它。我是Cordova应用程序构建的新手，而Javascript则是新手，但是，我是HTML专家。

如果我分离出微调器HTML并在Firefox中对其进行测试，则微调器将显示正常。但是，同样，它在我的Android应用中无法正常运行。加载WebView / Inappbrowser时，在我的页面加载之前，它仍然显示笨拙的白屏。但是，我的页面确实可以正确加载。

下面是我的Cordova index.html文件中的代码，似乎是发生问题的地方。请注意，该URL为http，但我已将该URL列入白名单。

谁能告诉我我做错了什么？任何帮助，将不胜感激。谢谢！

function goOnline() {
// Load the actual online content in InAppbrowser

//use some really slow page for testing
var path="http://www.someexamplesite.com";

// Using '_self' to force WebView open.
var ref = cordova.InAppbrowser.open(path,'_self','location=no');

//spinner html
var spinner ="<!DOCTYPE html><html><head><Meta name='viewport' content='width=device-width,height=device-height,initial-scale=1'><style>.loader {position: absolute;    margin-left: -2em;    left: 50%;    top: 50%;    margin-top: -2em;    border: 5px solid #f3f3f3;    border-radius: 50%;    border-top: 5px solid #3498db;    width: 50px;    height: 50px;    -webkit-animation: spin 1.5s linear infinite;    animation: spin 1.5s linear infinite;}@-webkit-keyframes spin {  0% { -webkit-transform: rotate(0deg); } 100% { -webkit-transform: rotate(360deg); }}@keyframes spin {  0% { transform: rotate(0deg); }  100% { transform:rotate(360deg); }}</style></head><body><div class='loader'></div></body></html>";

//intended webpage is loaded here
ref.executeScript({code: "(function() {document.write(\""+spinner+"\");window.location.href='"+path+"';})()"});

//loadstart event
ref.addEventListener('loadstart',function(event) {
    //nothing specific needed for spinner                        
});

//loadstop event
ref.addEventListener('loadstop',function(event) {
    //nothing specific needed for spinner
});

}

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

cordovainappbrowserjavascriptspinnerspinnerspinnerwebviewwebview