أنجولار جي إس:النهج الصحيح لاستخدام Google Analytics

Question

أتساءل ما هي الطريقة الصحيحة لدمج Google Analytics في تطبيق AngularJS الخاص بي.أرغب في تقديمه من خلال DI، حتى أتمكن من الاستهزاء به أثناء اختبار الوحدة واختبار البيانات التي يتم إرسالها إليها.

كنت أحاول شيئًا مثل هذا:

.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;
})

ولكن بالطبع لا يعمل، لأن الأول هو كائن وهمي ومتى analytics.js الأحمال، ويستبدل window.qa (أي:window[document['GoogleAnalyticsObject']]) مع التنفيذ السليم.لذلك، عند تشغيل الخدمة، يتم إرجاع التنفيذ الوهمي.

أعتقد أن استخدام موفر الخدمة سيكون الطريقة الصحيحة، حيث أرغب أيضًا في تكوين بعض المعلمات (مثل معرف المستخدم، وما إلى ذلك...)، ولكن ليس لدي أي فكرة عن كيفية إعداده بهذه الطريقة.

ما هو النهج الصحيح؟

Answer 1

هذا أفضل ما حصلت عليه حتى الآن:

.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();
})

إنه مزود يمكن تهيئته:

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

ورحب ردود الفعل.