Clever Geek Handbook

Ionic / Cordova Web App - index.html startup errors

When launching my Ionic app on iOS device and Ionic Lab, there are various pop-ups that appear on launch. I haven't been able to find out what they mean and how to resolve, so I hope someone here can help.

The app will load if I accept the first popup and then cancel the rest.

Popup windows:

Popup 1: gap_init: 2

Popup 2: Gap: [null, "CoreAndroid", "messageChannel", "CoreAndroid867226728"]

Popup 3: Clearance: [null, "CoreAndroid", "show", "CoreAndroid1105789195"]

Popup 4: Gap: [null, "CoreAndroid", "overrideBackbutton", "CoreAndroid633498247"]

Due to the error saying "CoreAndroid" I am guessing it is related to Android configuration.

I am using a framework based on a package I found on CodeCanyon. Link below: Codecanyon Ionic App

I can post any code you wish for me, so please let me know.

Here is the home.html file:

<ion-view view-title="{{appname}}">
<ion-nav-buttons side="right">
    <div class="cart-total ink">
        <button class="button ink icon-cart button-icon button-clear ion-ios-search-strong" ui-sref="quicksearch"></button>
    </div>
    <div class="cart-total ink" ui-sref="app.cart">
        <div ng-if="totalCartItem>0">
            <span>{{totalCartItem}}</span>
        </div>
        <button class="button ink button-icon button-clear fa fa-shopping-basket"></button>
    </div>
</ion-nav-buttons>
<ion-content class="home bg" overflow-scroll="true" scroll-to-top="150" delegate-handle="scroller">
    <ion-refresher
        on-refresh="doRefresh()">
    </ion-refresher>
    <div class="slider" ng-if="homeSlider">
        <ion-slide-box auto-play="1000" does-continue="true">
            <ion-slide ng-repeat="x in slides track by $index">
                <a href="#/app/{{x.params}}">
                    <div class="img" style="background-image: url({{x.img}})"></div>
                    <ion-spinner class="onload"></ion-spinner>
                </a>
            </ion-slide>    
        </ion-slide-box>
    </div>
    <div class="row">
        <ion-scroll direction="x">
            <div class="wide">
                <div ng-repeat="x in categories" ui-sref="app.category({id: x.id, slug: x.slug, title: x.name})">
                    <div class="slide-item">
                        <div ng-if="!x.image" class="img" style="background-image: url(img/product.png)"></div>
                        <div ng-if="x.image" class="img" style="background-image: url({{x.image}})"></div>
                        <ion-spinner class="onload"></ion-spinner>
                    </div>
                    <span class="out"></span>
                    <h3 class="center" ng-bind-html="x.name"></h3>
                </div>
            </div>
        </ion-scroll>
    </div>
    <div ng-if="products" class="item item-divider">
        LATEST PRODUCTS
    </div>
    <div class="row grid" ng-repeat="x in products track by $index" ng-if="$index%2==0">
        <div class="col col-50 ink item" ng-if="$index < products.length" ui-sref="app.product({id: products[$index].id})">
            <div class="badge">
                <span ng-if="!products[$index].in_stock" class="sold">{{$root.Dict.TXT_SOLD}}</span>
                <span ng-show="products[$index].regular_price > 0 && products[$index].on_sale" class="sale">
                    {{products[$index] | discount | number:0}}% OFF
                </span>
            </div>

            <ion-spinner class="onload"></ion-spinner>

            <div class="img" style="background-image: url({{products[$index].featured_src ? products[$index].featured_src : 'img/product.png'}})"></div>
            <div class="info">
                <h3>{{products[$index].title}}</h3>
                                    <span ng-bind-html="products[$index].price | currency:format:decimal"></span>
                <del ng-show="products[$index].regular_price > 0 && products[$index].on_sale" ng-bind-html="products[$index].regular_price | currency:format:decimal"></del>
                    </div>
        </div>
                        <div class="col col-50 ink item" ng-if="$index+1 < products.length" ui-sref="app.product({id: products[$index+1].id})">
            <div class="badge">
                <span ng-if="!products[$index+1].in_stock" class="sold">{{$root.Dict.TXT_SOLD}}</span>
                <span ng-show="products[$index+1].regular_price > 0 && products[$index+1].on_sale" class="sale">
                    {{products[$index+1] | discount | number:0}}% OFF
                </span>
            </div>

            <ion-spinner class="onload"></ion-spinner>

            <div class="img" style="background-image: url({{products[$index+1].featured_src ? products[$index+1].featured_src : 'img/product.png'}})"></div>
            <div class="info">
                <h3 ng-bind-html="products[$index+1].title"></h3>
                                    <span ng-bind-html="products[$index+1].price | currency:format:decimal"></span>
                                    <del ng-show="products[$index+1].regular_price > 0 && products[$index+1].on_sale" ng-bind-html="products[$index+1].regular_price | currency:format:decimal"></del>
            </div>
        </div>
    </div>
    <ion-infinite-scroll on-infinite="loadMore()" distance="10%" ng-if="more"></ion-infinite-scroll>
  </ion-content>
  <scroll-to-top-button animate="true">
    <div class="float-button">
        <span class="height-fix">
            <a class="content">
                <i class="ion-ios-arrow-up"> </i>
            </a>
        </span>
    </div>
</scroll-to-top-button>

And here is the index.html file:

    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <meta http-equiv="Content-Security-Policy" content="default-src * gap://ready; style-src * &apos;unsafe-inline&apos;; script-src * &apos;unsafe-inline&apos; &apos;unsafe-eval&apos;  data: gap: https://ssl.gstatic.com http://ionstore.ionicpremium.com https://*.paypal.com/*">



    <title>Ionstore</title>

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

    <link href="fonts/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="fonts/line-icon/css/line-icon.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">
    -->
  </head>
  <body ng-app="app">
    <ion-nav-view></ion-nav-view>

    <!-- LOAD IONIC -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="js/ionic.material.min.js"></script>

    <!-- NGCORDOVA -->
    <script src="js/ng-cordova.min.js"></script>
    <script src="cordova.js"></script>

    <!-- PAYPAL GATEWAY -->
    <script type="text/javascript" src="js/paypal-mobile-js-helper.js">
    </script>    

    <!-- LOAD CONTROLLER -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/filter.js"></script>
    <script src="js/directive.js"></script>
    <script src="js/services.js"></script>
    <script src="js/config.js"></script>
    <script src="js/language.js"></script>

    <script src="js/topscroller.js"></script>
    <script src="js/wcapi.js"></script>

    <!-- LOAD ANGULAR MOMENT -->
    <script src="js/moment.min.js"></script>
    <script src="js/angular-moment.min.js"></script>

  </body>
</html>
+3


source to share


2 answers


Modify the index.html file. cordova.js needs to be called at the bottom of the page. This worked for me.



  <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <meta http-equiv="Content-Security-Policy" content="default-src * gap://ready; style-src * &apos;unsafe-inline&apos;; script-src * &apos;unsafe-inline&apos; &apos;unsafe-eval&apos;  data: gap: https://ssl.gstatic.com http://ionstore.ionicpremium.com https://*.paypal.com/*">



    <title>Ionstore</title>

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

    <link href="fonts/font-awesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="fonts/line-icon/css/line-icon.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">
    -->
  </head>
  <body ng-app="app">
    <ion-nav-view></ion-nav-view>

    <!-- LOAD IONIC -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="js/ionic.material.min.js"></script>

<script type="text/javascript" src="js/paypal-mobile-js-helper.js">
    </script>    

    <!-- LOAD CONTROLLER -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/filter.js"></script>
    <script src="js/directive.js"></script>
    <script src="js/services.js"></script>
    <script src="js/config.js"></script>
    <script src="js/language.js"></script>

    <script src="js/topscroller.js"></script>
    <script src="js/wcapi.js"></script>

    <!-- LOAD ANGULAR MOMENT -->
    <script src="js/moment.min.js"></script>
    <script src="js/angular-moment.min.js"></script>


 <script src="js/ng-cordova.min.js"></script>
    <script src="lib/ngCordova/dist/ng-cordova.js"></script>
    <script src="cordova.js"></script>
    <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
     </body>
</html>
+3


source


You are using android cordova.js in an iOS app.



You don't need to add the cordova.js file, just link it in index.html, it will be generated for each platform and copied to the correct location.

0


source






More articles:


All Articles