Showing Blank White Screen

ionic-v1
41

$urlRouterProvider.when(’’, ‘/home’);

42

That was my exact problem, loading backand without the https:
//cdn.backand.net/backand/dist/1.8.2/backand.min.js

This way worked right away:
https://cdn.backand.net/backand/dist/1.8.2/backand.min.js

Thanks a lot !

43

Hi, i am pretty much new to ionic, coming from strong native iOS background. I have installed WKWebView plugin in my ionic app and found the WSOD, and it goes away when i uninstall the plugin. Which way is suggested ?, should i add WKWebView and go with workaround or to stick what i have (UIWebview) now.what are the odds.?

44

I’m having the same problem. I havn’t tried your solutions yet, because i can start my app when i turn wifi off. My app starts when im using like 3g, h, h+ and when internet is completely turned off. Once i turn off WLAN and start my app, it shows me white screen right after splashscreen.

UPDATE:
Works now. I just moved my plugin function from .run into ionic.platformReady.

45

Removing <base href="/"> from my index.html file fixed the blank screen, but things are not much better. For my app, it loads the red header bar (without my logo or buttons) but nothing else.

46

I have experienced the white screen of death a couple of times in the past few weeks as I have been learning AngularJS in general, and Ionic in particular, and the issues were quite different from what I’ve seen posted, so I thought I would share.

In both cases, it worked fine in the browser and on iOS 9.x devices, but failed on iOS 8.x devices. The white screen displayed with no console logs, and none of the solutions suggested helped. I ended up isolating the problems by spending a few hours rebuilding the app from a blank project.

In the first case, it was a typo in which I declared and defined a nested array using [ { } ] instead of [ [ ] ] . Oops!

In the second case, I was doing some bitwise operations and used 0b11111100. Switching it to 0xFC fixed it.

Note that jshint did NOT find either of these issues.

47

This solution worked for me. Thanks, Jangla!

48

Thanks! JsHint helps me solve the problem. I just follow the guidelines.

1 Like
49

This worked for me. In your config.xml file add < allow-navigation href="*" />

Source: Apache cordova-plugin-whitelist README

1 Like
50

is it work?can you tell me?

51

My issue was, I was using a template literal ( ` ) for a multiline string (which is supported from ES6 and above).

My app worked fine in the browser and in some phones but gave the WSOD (White Screen of Death) in others.

For example, it worked fine in Samsung Galaxy S3, but got a WSOD in Note 2.

So, I changed the following -

var test = `<div class="modal">Test
 <i class="ion-icon"></i>
</div>`;

to the following

var test = '<div class="modal">Test' +
'<i class="ion-icon"></i>' +
'</div>';

It worked like a charm afterwards!

Also, make sure JSLint is happy. If you haven’t added JSLint to your project before, you can follow this - Integrate jshint in ionic starter project

52

have you guys sloved this iusse?

53

hey guys, I am happy to tell you all that the problem has been solved, just changed the ES6 to ES5 in your code.!!!And it will worked!

54

I had a problem like this when i linked to a new page using href. with stateParams it works using the browser but its gave me a blank screen in the emulator . i changed the href to ui-sref and its worked now.

55

Just my two cents,

I had similar issue and it was caused by incorrect Content-Security-Policy, was able to fix it by properly sandboxing using CSP.

If a sandbox existed then chromium(Lolipop) puts the app in an iframe and cordova has no way of initializing itself as the cordova.js does not run in the outside container but runs inside the iframe. If you don’t want sandbox and you had arbitrary external sites loading into the app then you may need to be careful to put them in an iframe and specify appropriate parameters in iframe so that they don’t take over your App.

Below is the the example code

Fix it as needed.

More Info

https://developer.chrome.com/apps/app_external
https://developer.chrome.com/apps/manifest/sandbox
http://content-security-policy.com/

56

Easiest way to find the errorwith Android, if livereload and other ionic debugging does not help what you can do is.

  1. Build your ionic project.
  2. Copy the android folder in platform to some other directory.
  3. Open that android folder with android studio as a project.
  4. Now try to debug or run it will show you the exact error.

Thank you

57

This was my problem, thanks

58

Hoooooooooooo!
I found my problem… it’ the wrong path of the css and js files in index.html
wrong? not really wrong
but adding “android_asset/www/” before all path it work

So I don’t understand why the android_asset/www/ doesn’t became automatically my route? Is possible to force it with ionic

So now I need to understand how can I run android and ios and automatic modify the path, or better find a way for expayn what is my route

any one have an idea?

59

Fixed my WSOD too! Cordova-plugin-whitelist and the allow navigation.

60

I’m sharing my experience here, in case it’s useful to someone:

Had the same problem. Checked on all dependencies and injections. App worked fine on Web and Android, but crashed on iOS. So I ran
ionic emulate ios -lc
and found out that I had a continue operand inside an if, but not directly inside an Object().forEach(). Turns out that Chrome and Webview read this JS correctly, but not Safari. I replaced the continue with a return ;, which does the same

So there goes two hints:

  1. Test your app with the command above so you can have a full debug log
  2. Save a lot of time by just testing your app in every browser you have
1 Like