2015-10-29 4 views
0

Я искал в Интернете, как добавить Google Analytics в ионный проект. Есть много разных плагинов для corova ect, но не получилось даже работать. Может быть, я делаю что-то неправильно, надеюсь, что кто-то может помочь.Ионный с аналитикой google

Что я получил, теперь работает на ионной подаче --lab вариант. Но не тогда, когда он установлен на телефоне. У меня также не было никаких ошибок в консоли (--lab и Phone). Отладка также не загружается при подключении к проверке. Так что я не уверен, что происходит один здесь ...

Index.html

<head> 
    <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
    <link href="css/style.css" rel="stylesheet"> 
    <script src="lib/ionic/js/ionic.bundle.js"></script> 
    <script src="lib/ngCordova/dist/ng-cordova-mocks.min.js"></script> 
    <script src="lib/ngCordova/dist/ng-cordova.min.js"></script> 
    <script src="cordova.js" ></script> 
    <script src="js/openfb.js"></script> 
    <script src="js/ngopenfb.js"></script> 
    <script src="js/app.js"></script> 
    <script src="js/controllers.js"></script> 
    <script src="js/services.js"></script> 
    </head> 
    <body ng-app="starter" ng-controller="AppCtrl"> 

    <script> 
      (function (i, s, o, g, r, a, m) { 
       i['GoogleAnalyticsObject'] = r; 
       i[r] = i[r] || function() { 
       (i[r].q = i[r].q || []).push(arguments) 
       }, i[r].l = 1 * new Date(); 
       a = s.createElement(o), 
         m = s.getElementsByTagName(o)[0]; 
       a.async = 1; 
       a.src = g; 
       m.parentNode.insertBefore(a, m) 
      })(window, document, 'script', 'js/analytics.js', 'ga'); 

      ga('create', 'XX-XXXXXXX-XX', 'auto'); 
    </script> 
</body> 
</html> 

App.js

.config(function ($stateProvider, $urlRouterProvider) { 

      $stateProvider 
        .state('tab', { 
        url: '/tab', 
        abstract: true, 
        templateUrl: 'templates/tabs.html', 
        }) 

        .state('tab.dash', { 
        url: '/dash', 
        views: { 
         'tab-dash': { 
         templateUrl: 'templates/tab-dash.html', 
         controller: 'DashCtrl' 
         } 
        }, 
        pageTitle: '[app] Dashboard' 
        }) 

Controller.js

angular.module('starter.controllers', []) 
     .controller('AppCtrl', function ($rootScope, $scope, $window, $http, FB) { 
      $rootScope.token = window.localStorage.getItem("token"); 
      $rootScope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) { 
      $window.ga('send', 'pageview', {page: toState.pageTitle}) 
      }) 

ответ

0

Я получил его но я не думаю, что это лучшая практика.

В главном контроллере.

function _waitForAnalytics() { 
     if (window.analytics) { 
      window.analytics.startTrackerWithId('XX-XXXXXXX-XX'); 
      window.analytics.trackView('Start'); 
      console.log("Analytics success"); 
     } else { 
      console.log("Analytics not loaded"); 
      setTimeout(function() { 
      _waitForAnalytics(); 
      }, 10000); 
     } 
     } 
     _waitForAnalytics(); 

Странно, потому что устройство готово должно это сделать.

2

Angulartics - хорошая библиотека для интеграции Google Analytics с угловым. Это может быть сделано для работы с ионическим простым способом. Сначала добавьте библиотеки.

ionic plugin add cordova-plugin-google-analytics --save 
bower install angulartics-google-analytics --save 

Включите скрипты angulartics в index.html. Трюк использует (пока) недокументированные плагины Google Corolla для Google Analytics.

<!-- angulartics --> 
<script src="bower_components/angulartics/src/angulartics.js"></script> 
<script src="bower_components/angulartics/src/angulartics-ga-cordova-google-analytics-plugin.js"></script> 

<!-- angulartics google analytics --> 
<script src="bower_components/angulartics-google-analytics/lib/angulartics-ga.js"></script> 

Тогда в вашем app.js, включает в себя модули и установить идентификатор отслеживания в блоке конфигурации

angular.module('app', [ 
    'ionic', 

    // Include angulartics modules  
    'angulartics', 
    'angulartics.google.analytics', 
    'angulartics.google.analytics.cordova' 
]) 

// Add config block  
.config(function (googleAnalyticsCordovaProvider) { 
    googleAnalyticsCordovaProvider.trackingId = "UA-******-*"; 
}) 

Вот так. Теперь он должен работать.

Смежные вопросы