web-dev-qa-db-ja.com

Cordova-スプラッシュ後の白い画面、コンソールの例外なし

コルドバアプリから少し離れていましたが、昨日新しいクローンを作成したところ、「死の白い画面」の症状があることに気付きました-スプラッシュ画面が表示され、プログラムが読み込まれ...空白の画面を取得します。いくつかの詳細：

  • CLI：Cordova 6.1.1、Android 5.1.1、ios 4.1.1
  • スプラッシュ画面を表示するために特別なプラグインを使用していません。ただ<splash>my config.xml file の要素。
  • これは、ローカルビルドとPhoneGapビルド（デバッグとリリース）の両方でiOSとAndroidの両方で発生しています。
  • IOS（Safariの開発ツールを使用）またはAndroid（Chromeの開発ツールを使用））のいずれかで、コンソールにリソースがないことの例外はありません。
  • 前回の動作確認済みビルドとの差分 を実行しましたが、実際には何も表示されません。未定義のアンダースコア参照を見ましたが、その変更をバックアウトしましたが、何も解決しませんでした-とにかくコンソールに例外が表示されると思います。

Cordova/PhoneGapは最近、これを引き起こしているかもしれない何かをしましたか？これを分離する方法についてのアイデアはありますか？私は本当に困惑しています。

androidioscordova
25
eb1

まあそれはいです。 was例外がスローされていることが判明しました。ブラウザー開発ツールがそれを拾うには早すぎただけです（iOSの場合Chrome Android）それぞれ、ブラウザのターゲット（cordova platform add browserなど）。そのため、ブラウザプラットフォームは、私が推測するものに対して有用です。 :-)

私の場合、cordova-sqlite-storageプラグインは、すべてを更新したときにコードを壊す破壊的なAPIの変更を行っていました。解決策は、config.xmlファイルでプラグインを以前のバージョンに固定することでした。

だから、学んだ教訓：

  • 起動時に例外がスローされていると思われる場合は、ブラウザプラットフォームを使用して追跡できます。
  • Config.xmlのspecパラメーターを使用して、プラグインを特定のバージョンに固定します。これにより、将来の心痛が軽減されます。
  • [@jcesarmobileの別のオプション、以下]ブラウザの開発ツールで更新を押すと、例外も発生します。いいね！

Config.xmlに戻り、他のアイテムを固定し、上記のようにクリーンアップを行います。みんな、ありがとう。

24
eb1

私はあなたのアプリを実行するように仕向けました。これは私が従った手順です。

1）まず、config.xmlでスプラッシュスクリーンプラグインの場所とともにスプラッシュスクリーンの設定を宣言する必要があります。これはあなたが行方不明だと思うものです

<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）スプラッシュスクリーンのイメージをconfig.xmlで宣言します。これは既に完了しています。

プロジェクトの構造を簡素化するため、screen/Androidフォルダーではなく、Android project（ldpi、mdpi、hdpi、xhdpiなど）のデフォルト密度フォルダーに画像を保持することをお勧めします。

    <!-- 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） スプラッシュスクリーンプラグインクラス をAndroid下のプロジェクト構造org.Apache.cordova.splashscreenに追加またはスプラッシュスクリーンCordovaプラグインをインストールする

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

4）最後の最も重要なステップは、wwwフォルダーにcordova.jsが必要です

Cordova.js in assets

そしてその後、私はあなたのウェブアプリを実行することができました

enter image description here

私はAndroid開発者です

6
Hitesh Sahu

Ember.jsでcordovaを使用しているときに、同様の問題が発生しました。それは私のアプリケーションのURL変更戦略についてでした。

この回答 をご覧ください。問題に関連している可能性があります。

2
ykaragol

splash-screenにスプラッシュを追加する場合、またはconfig.xmlプラグインなしで適切に動作するには、iOSとAndroidの両方にsplash-screenプラグインをインストールする必要がありますHTMLでスプラッシュスクリーンを作成し、コンテンツとログインの2つの部分に分けて、コンテンツスタイルの表示を設定します：なし。表示：ブロックまたはあなたが望むもの

また、config.xmlの設定の下にありません

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

この設定をconfig.xmlに追加してみてください。おそらくこれが問題です

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

私のために働いた唯一の修正はここにありました： http://www.codingandclimbing.co.uk/blog/ionic-2-fix-splash-screen-white-screen-issue-14

基本的にconfig.xmlファイルを編集します。スプラッシュスクリーンのセットアップは次のようになります。

<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

私の場合、headに<meta http-equiv="Content-Security-Policy">タグがないと、白い画面が表示されました。

1
Yuval A.

これらの行をconfig.xmlに追加しました

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

また、screendelayを3000として指定すると黒い画面が表示されるので、6000に変更しました。js、css、および画像ファイルのロードに時間がかかると思います。

1
Vijay

私の場合、最初の画面がまだマウントされる前にALERTを置きます。

1
Luiz Leite

私の問題はES6にあり、iPhoneで完全に動作し、Android 6ですが、Android 4および5では動作しません。

0
Fabio Campinho

私はこのような状況にあり、それを解決しました。

私の場合、このコードに似たものでした：

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

上記のコードはAndroid 7.0で正常に動作しますが、スプラッシュ後の白い画面のみAndroid 4.4.4

これに変更：

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

すべてのデバイス（少なくともすべてのデバイス）で実行する

0
Albert

私の場合、誤ってapp.jsの状態定義にコメントしました。

0
Priyank

1 >>起動時に例外がスローされると思われる場合は、ブラウザプラットフォームを使用して追跡できます。 2 >> config.xmlのspecパラメーターを使用して、プラグインを特定のバージョンにピン留めします。これにより、将来の心痛が軽減されます。

0
Idrish Multani