Question

Je me demande quelle est la bonne façon d'intégrer Google Analytic dans mon application AngularJS.Je voudrais le fournir via DI, afin de pouvoir le simuler pendant les tests unitaires et tester les données qui lui sont envoyées.

J'essayais quelque chose comme ceci :

.service('$ga', function () {
    (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', '//www.google-analytics.com/analytics.js', 'ga');

    ga('create', 'GA_KEY', 'auto');
    ga('send', 'pageview');
    return ga;
})

Mais bien sûr, cela ne fonctionne pas, puisque d'abord c'est un objet factice et quand analytics.js charge, remplace window.qa (c'est à dire:window[document['GoogleAnalyticsObject']]) avec une mise en œuvre appropriée.Ainsi, lorsque le service s'exécute, renvoie l'implémentation factice.

Je suppose que l'utilisation d'un fournisseur sera la bonne solution, car j'aimerais également configurer certains paramètres (comme l'ID utilisateur, etc...), mais je n'ai aucune idée de comment le configurer de cette façon.

Quelle est la bonne approche ?

Était-ce utile?

La solution

C'est le meilleur que j'ai eu jusqu'à présent :

.provider('$ga', function () {

    window['GoogleAnalyticsObject'] = 'ga';
    window['ga'] = window['ga'] || function () { (window['ga'].q = window['ga'].q || []).push(arguments)}
    window['ga'].l = 1 * new Date();
    var script = document.createElement('script');
    var prevScript = document.getElementsByTagName('script')[0];
    script.async = 1;
    script.src = '//www.google-analytics.com/analytics.js';
    prevScript.parentNode.insertBefore(script, prevScript);

    var provider = function () {
        var me = {};

        me.$get = function () {
            ga('send', 'pageview');
            return function () {                
                return window.ga.apply(window, arguments);
            }
        };

        me.ga = function () {
                return window.ga.apply(window, arguments);
        };

        return me;
    };

    return provider();
})

C'est un fournisseur qui peut être configuré :

.config(['$gaProvider',function ($gaProvider) {
    $gaProvider.ga('create','UA-XXXXXX-Y','auto');
}])

Les commentaires sont les bienvenus.

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top