JS:如何增加第二個 google 分析追蹤碼?

如何增加第二個 google 分析追蹤碼?

結論:

除了原本的程式碼外, 再 想辦法 補上新的追蹤碼.

    (function(...) { 
    //google ga code 
    })(window, 
       document,
       'script', 
       '//www.google-analytics.com/analytics.js',
       'ga');

    ga('create', 'XX-nnnnnnnn-1', 'auto');
    ga('send', 'pageview');
// 原本內定的 ga code XX-nnnnnnnn-1

/* 加入下列兩行程式, 將 XX-nnnnnnnn-2 換成自己的追蹤碼 */
    ga('create', 'XX-nnnnnnnn-2', 'auto', 'anotherTracker');
    ga('anotherTracker.send', 'pageview');
// 增加第二個追蹤碼 XX-nnnnnnnn-2, 並取惟一名字, 例: anotherTracker
// 以`anotherTracker.send` 明確呼叫 "pageview"

廢話:

漢賽爾與葛麗特在丟麵包屑之前, 有想過要多丟一下別的東西?

時常, 我們會擔心事情沒正常被做, 而重複的檢查或執行. 有時這會解決問題, 而有時問題就是這樣產生的.

然而, 作為一個負責任的工程師, 以上兩者都需要被避免.

正文:

整理一下 Google 分析產出的 js 程式碼, 如下

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

簡言之, 就是將 ga 設成瀏覽器全域變數, 並載入 google 的 analytics.js 程式, 將裡面的 function 設給 ga 這個變數. 接下來就可以透過 ga 這個 function 來做事.

ga 的第一個參數, 是要執行的方法的名稱, 例如用 ‘create’ 將追蹤碼以第二個參數傳入. 使用 ‘create’ 方法時, 如果 ga 沒有給定第四個參數, 則會建立一個匿名內定的物件. 所以接下來只要呼叫 ‘send’ 方法, 將 ‘pageview’ 這個參數送出, 即可.

因為要送出第二個追蹤碼, 所以必須建立第二個實體物件, 但因為已經有一個匿名內定的物件了. 如果再次以 ga('create', 'XX-nnnnnnnn-2', 'auto') 呼叫 create, 則原本的匿名內定的物件會被覆蓋. 原本內定的 XX-nnnnnnnn-1 也就變成 ‘XX-nnnnnnnn-2’.

所以, 必須傳入第四個參數作為新的物件的名稱. 然後以 ‘<物件名稱>.send’ , 而不是以 ‘send’ 來執行.