How did adding 1 line in index.html solve my black screen issue!?

ionic-v1
1

Hi,

I been having a strange issue after updating xCode. My App was working fine but after the update it started to have a strange black screen after splash screen in iOS. The App will just show a black screen until i minimize the app and open it again. With simulators it will just show the black screen.

I spent 2 days debugging this and tried almost every thing. Nothing worked. Until i tried adding 1 line in the very beginning of index.html. just adding number 1 for example. And it worked! Although this number will cause problems in the app’s bar but at least it worked. I am trying to understand why and what can be the problem?

I tried running with > ionic run ios and also through building with xcode directly. Without adding that first line in index.html it will be stuck at the black screen.

Here is my index.html:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src  'self' 'unsafe-inline' *">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/ngstorage/ngStorage.min.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="lib/ngCordova/dist/ng-cordova.min.js"></script>
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/parse-1.6.14.min.js"></script>
    <script src="js/wcapi.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/services.js"></script>
    <script src="js/app.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&key="></script>
    <script src="lib/angular-twilio/angular-twilio.js"></script>
    <script src="lib/angular-twilio-verification/angular-twilio-verification.js"></script>
    <script src="lib/angular-wizard/dist/angular-wizard.js"></script>
  </head>
  <body ng-app="starter">
      <ion-nav-view></ion-nav-view>  
      
  </body>
</html>
2

UPDATE:

Also removing this meta fixed it:

<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src 'self' 'unsafe-inline' *">

Any one can help with an explanation?