web-dev-qa-db-ja.com

外部JSファイルからのGoogleAnalytics非同期コードの使用

GoogleAnalyticsトラッキングコードの非同期バージョンをウェブサイトに追加しようとしています。

JavaScriptを別のファイルに保存し、そこから呼び出したいと思います。

現在、.jsファイルにあるものは次のとおりです。

function addLoadEvent(func) {
    var oldonload = window.onload;
    if (typeof window.onload != 'function') {
        window.onload = func;
    } else {
        window.onload = function() {
            oldonload();
            func();
        }
    }
}

function loadtracking() {
    var _gaq = _gaq || [];
        _gaq.Push(['_setAccount', 'UA-XXXXXXX-X']);
        _gaq.Push(['_trackPageview']);

        (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
}

addLoadEvent(loadtracking);

そして、これが私のマスターページの<head>タグにあるものです：

<script type="text/javascript" src="js/google-analytics.js" ></script>

ただし、数日経っても統計情報が得られないため、明らかに問題があります。

私が変更する必要があるアイデアはありますか？

ありがとう、ニール

EDIT： OK ...以下のフィードバックの後、.jsのnew現在のコンテンツを追加しますファイル。これが解決された場合に、同様のことをしようとしている他の人々に役立つことを願って、最新の状態に保ちます。

var _gaq = _gaq || [];

function loadtracking() {
        window._gaq.Push(['_setAccount', 'UA-XXXXXXX-X']);
        window._gaq.Push(['_trackPageview']);

        (function() {
            var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
        })();
}

loadtracking();
javascriptasynchronousgoogle-analyticsunobtrusive-javascript
30
NeilD

変数定義var _gaqは関数内にあります。つまり、その関数内でローカルにスコープされ、グローバルに存在することはありません。 Google Analyticsは、グローバル変数_gaqに依存しています。そのような関数内に保持したい場合は、window._gaqとして参照してください。

23
Brian

非同期追跡コードの要点を完全に見逃しています。古い同期GAを含めるのとまったく同じなので、外部ファイルに入れないでください。

そして最も重要なことは、追跡コードをwindow.onloadに延期しないでください。起動が遅すぎる可能性があるため、.

非同期を使用する場合GA インラインスクリプトタグでドキュメントの上部に配置するだけ。これは推奨事項 on- Google Analytics Webサイト も同様です。

ページまたはテンプレートが使用する可能性のある他のスクリプトの後に、ページの<head>セクションの下部に非同期スニペットを挿入します。

14
gblazex

正直なところ、これらの投稿はかなり古いので、すべて読んだわけではありません。しかし、最近、1000個の静的HTMLファイルである古いウェブサイトにGtag（分析追跡用のGoogleタグマネージャー）を追加する必要がありました。非常に古いサイトが言った！私の目的では、パフォーマンスについては心配していませんでしたが、トラフィックを測定して移行できるようにしました。ケースは異なる場合がありますが、以下のコードはGtagの外部jsインクルードで機能します。

上記のコードはレガシーga.js用であるため、このファイルを使用して以下のコードをロードしました

//Added Google Anyltics Tag Container Tracking - included here to min rebuilding DOM 

function loadGoogleAnalytics(){
    var ga = document.createElement('script'); 
    ga.type = 'text/javascript'; 
    ga.async = true;
    ga.src = 'https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-X';

    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(ga, s);
}

loadGoogleAnalytics(); //Create the script 

window.dataLayer = window.dataLayer || [];

function gtag(){dataLayer.Push(arguments);}

gtag('js', new Date());

gtag('config', 'UA-XXXXXXXXX-1');
//Confirmed with Google tag Assistant
0
Joshua Berkowitz