web-dev-qa-db-de.com

Cordova - weißer Bildschirm nach dem Start, keine Ausnahmen in der Konsole

Ich war ein wenig von meiner Cordova-App weg, habe aber gestern einen frischen Klon gemacht und festgestellt, dass es die Symptome "weißer Bildschirm des Todes" hat - der Startbildschirm wird angezeigt, das Programm wird geladen ... und dann habe ich gerade einen leeren Bildschirm erhalten Einige weitere Details:

  • CLI: Cordova 6.1.1, Android 5.1.1, iOS 4.1.1
  • Ich verwende keine speziellen Plugins zur Anzeige eines Begrüßungsbildschirms - nur <splash> Elemente in meiner config.xml-Datei .
  • Dies gilt sowohl für iOS als auch für Android, sowohl für lokale Builds als auch für PhoneGap Build (d. H. Debug und Release).
  • Es gibt keine Ausnahmen für fehlende Ressourcen in der Konsole, weder in iOS (mit den Dev-Tools von Safari) noch in Android (mit den Dev-Tools von Chrome).
  • Ich habe ein diff mit meinem letzten bekannten funktionierenden Build gemacht und es gibt wirklich nichts, was herauskommt. Ich habe eine undefinierte Underscore-Referenz gesehen, aber ich habe die Änderung rückgängig gemacht und nichts gelöst. Ich glaube, ich würde die Ausnahme in der Konsole sowieso sehen.

Hat Cordova/PhoneGap kürzlich etwas getan, was dies möglicherweise verursacht? Irgendwelche Ideen, wie man diese isoliert? Ich bin wirklich ratlos.

24
eb1

Nun, das war hässlich. Es stellte sich heraus, dass eine Ausnahme war es wurde eine Ausnahme geworfen, es wurde nur zu früh für die Browser-Entwicklerwerkzeuge geworfen (Safari, Chrome für iOS bzw. Android). Die Ausnahme zeigte sich, als ich Dinge über das Browserziel (cordova platform add browser usw.) abwickelte. Diese Browserplattform ist also für etwas nützlich, denke ich. :-)

In meinem Fall hatte das Cordova-sqlite-storage-Plugin eine grundlegende API-Änderung vorgenommen, durch die der Code beschädigt wurde, als ich alles aktualisiert hatte. Die Lösung bestand darin, das Plugin in der Datei config.xml an eine frühere Version anzuhängen.

Lektionen gelernt:

  • Wenn Sie vermuten, dass während des Startens eine Ausnahme ausgelöst wird, können Sie die Browserplattform verwenden, um diese zu ermitteln.
  • Verbinden Sie Ihre Plugins mit dem Parameter spec in der config.xml mit einer bestimmten Version. Dies erspart Ihnen in Zukunft einige Schmerzen.
  • [Eine weitere Option von @jcesarmobile (siehe unten)] Wenn Sie in den Browser-Entwicklertools auf Aktualisieren klicken, wird die Ausnahme ebenfalls ausgelöst. Nett! 

Ich gehe zurück in die config.xml und pinne die anderen Elemente an - und mache wie oben vorgeschlagen eine Bereinigung. Nochmals vielen Dank.

21
eb1

Ich habe Ihre App ausgeführt, dies sind die Schritte, die ich befolgt habe.

1) Zuerst müssen Sie die Einstellungen für den Splash-Bildschirm zusammen mit dem Speicherort des Splash-Bildschirms in Ihrer config.xml festlegen. Dies ist, was ich denke, dass Sie vermisst werden

<preference
    name="SplashScreen"
    value="screen" />
<preference
    name="AutoHideSplashScreen"
    value="true" />
<preference
    name="SplashScreenDelay"
    value="5000" />

<feature name="SplashScreen" >
    <param
        name="Android-package"
        value="org.Apache.cordova.splashscreen.SplashScreen" />

    <param
        name="onload"
        value="true" />
</feature>

2) Deklarieren Sie Ihre Begrüßungsbildschirme in config.xml, was Sie bereits getan haben.

Ich empfehle Ihnen, Bilder in Standard-Dichteordnern des Android-Projekts (ldpi, mdpi, hdpi, xhdpi usw.) anstelle von Bildschirm-/Android-Ordnern zu belassen, da dies Ihre Projektstruktur vereinfacht.

    <!-- you can use any density that exists in the Android project -->
    <splash
        density="land-hdpi"
        src="res/drawable-land-hdpi/splash.png" />
    <splash
        density="land-ldpi"
        src="res/drawable-land-ldpi/splash.png" />
    <splash
        density="land-mdpi"
        src="res/drawable-land-mdpi/splash.png" />
    <splash
        density="land-xhdpi"
        src="res/drawable-land-xhdpi/splash.png" />
    <splash
        density="port-hdpi"
        src="res/drawable-hdpi/splash.png" />
    <splash
        density="port-ldpi"
        src="res/drawable-ldpi/splash.png" />
    <splash
        density="port-mdpi"
        src="res/drawable-mdpi/splash.png" />
    <splash
        density="port-xhdpi"
        src="res/drawable-xhdpi/splash.png" />
</platform>

3) Fügen Sie Splash Screen Plugin-Klasse in Ihre Android-Projektstruktur unter org.Apache.cordova.splashscreen ein, oder installieren Sie das Begrüßungsbildschirm-Cordova-Plugin 

https://cordova.Apache.org/docs/de/3.1.0/cordova/splashscreen/splashscreen.html

4) Der letzte und wichtigste Schritt muss Cordova.js in Ihrem www-Ordner haben

 Cordova.js in assets

Danach konnte ich Ihre Web-App ausführen

 enter image description here

Ich bin Android-Entwickler. Ich denke, etwas Ähnliches, das Sie möglicherweise für iOS tun müssen

6
Hitesh Sahu

Ich hatte ein ähnliches Problem bei der Verwendung von cordova mit ember.js. Es ging um die URL-Änderungsstrategie meiner Bewerbung. 

Schau mal auf diese Antwort , vielleicht hängt es mit deinem Problem zusammen.

2
ykaragol

Sie sollten das splash-screen-Plugin für iOS und Android installieren, um ordnungsgemäß zu funktionieren, wenn Sie Splash in config.xml hinzufügen. oder ohne splash-screen-plugin können Sie versuchen, einen Begrüßungsbildschirm mit HTML zu erstellen, den Körper in zwei Teile zu teilen: Inhalt und Login. Dann legen Sie die Anzeige des Inhaltsstils fest: keine. Wenn die App fertig geladen ist, legen Sie einfach die Anzeige des Ladebildschirms fest: Keine und die Bildschirminhalt des Inhalts: Blockieren oder was immer Sie möchten

Und Sie fehlen die folgenden Einstellungen in Ihrem config.xml

<preference name="SplashScreenDelay" value="3000" />
<preference name="SplashMaintainAspectRatio" value="true|false" />
<preference name="SplashShowOnlyFirstTime" value="true|false" />
2
NGB

Versuchen Sie, diese Einstellung Ihrer config.xml hinzuzufügen. Dies ist möglicherweise das Problem

<preference name="AutoHideSplashScreen" value="true"/>
2
Del

Das einzige Update, das für mich funktioniert hat, wurde hier gefunden: http://www.codingandclimbing.co.uk/blog/ionic-2-fix-splash-screen-white-screen-issue-14

bearbeiten Sie grundsätzlich Ihre config.xml-Datei. Das Startbild-Setup sollte folgendermaßen aussehen:

<preference name="ShowSplashScreen" value="true"/>
<preference name="SplashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="30000"/>
<preference name="AutoHideSplashScreen" value="false"/>
<preference name="SplashShowOnlyFirstTime" value="false"/>
<preference name="FadeSplashScreen" value="false"/>
<feature name="SplashScreen">
    <param name="Android-package" value="org.Apache.cordova.splashscreen.SplashScreen"/>
</feature>
1
Gio

Ein fehlendes <meta http-equiv="Content-Security-Policy">-Tag auf der head verursachte in meinem Fall einen weißen Bildschirm.

1
Yuval A.

Mein Problem war mit ES6, es läuft perfekt auf iPhone und Android 6, aber es funktioniert nicht mit Android 4 und 5.

0
Fabio Campinho

Ich habe diese Situation und habe sie gelöst.

In meinem Fall ähnelte es diesem Code:

$scope.images.Push({ id: i, src: "http://placehold.it/50x50" , pstb, trno});

Der obige Code läuft gut auf Android 7.0, aber nur weißer Bildschirm nach dem Aufprall auf Android 4.4.4

Daraufhin geändert:

$scope.images.Push({ id: i, src: "http://placehold.it/50x50", pstb: pstb, trno: trno});

Auf allen Geräten laufen (zumindest auf allen meinen Geräten)

0
Albert

Ich habe diese Zeilen in config.xml hinzugefügt

<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="6000" />

Ich habe auch einen schwarzen Bildschirm, wenn ich als 3000 Screendelay gebe. Also habe ich auf 6000 geändert.

0
Vijay

In meinem Fall habe ich versehentlich die Zustandsdefinition in app.js kommentiert.

0
Priyank

1 >> Wenn Sie vermuten, dass während des Startens eine Ausnahme ausgelöst wird, können Sie die Browserplattform verwenden, um die Ursache zu ermitteln .. 2. 2 Fügen Sie Ihre Plugins mithilfe des spec-Parameters in der config.xml auf eine bestimmte Version. Dies erspart Ihnen in Zukunft einige Schmerzen.

0
Idrish Multani

In meinem Fall stelle ich einen Alarm ein, bevor der erste Bildschirm noch montiert ist.

0
Luiz Leite