web-dev-qa-db-ja.com

UniversalAnalyticsをChrome拡張機能にどのように統合しますか?

chrome拡張ガイドには、古い分析インストールのチュートリアルがあります: https://developer.chrome.com/extensions/tut_analytics.html

手順では、httpsバージョンにリンクし、マニフェストを更新して、そのURLからスクリプトをロードできるようにするように指示しています。したがって、これらは新しいバージョンにも適用されます。実際、サーバーからスクリプトが読み込まれているのを確認できます。

スクリプトがロードされると、アナリティクスはそれ自体を適切に初期化せず、それらのイベントをサーバーに送信するためにその内部キュー(ga.f)を処理することはありません。コンソールにエラーはありません。静かに何もしません。

私の推測では、新しいユニバーサルアナリティクスは拡張環境で実行するように設定されていないだけですが、ユニバーサルドキュメントではそのことについては言及されていません: https://developers.google.com/analytics/devguides/collection/ analyticsjs /

universal Analyticsを拡張機能に追加することさえ可能かどうか、そしていつ追加されるかを誰かが知っていますか?

43
StefanHayden

Googleコードには issue があります:解決策は、独自のプロトコルチェック関数を分析に渡すか、チェックしない場合は単にnullを渡すことです、 公式の方法

これはafterga('create', ...)の後に来る必要があります

_ga('set', 'checkProtocolTask', null); // Disable file protocol checking.
_

したがって、元のanalytics.jsスクリプトを変更する必要はありません。標準のトラッキングコードスニペットを含め(「https:」プレフィックスを追加することを忘れないでください)、コンテンツセキュリティポリシーに「 https://www.google-analytics.com "」を追加するだけです。

Ayal gellesのソリューションに関する注意:_chrome-extension://..._ステートメントにはすでに含まれているため、コンテンツセキュリティポリシーに_'self'_を追加する必要はありません。また、ハードコードされたURLを介してスクリプトをロードする代わりに、chrome.runtime.getURL("path/to/analytics.js")を使用する必要があります。このように、拡張機能のIDを知る必要はありません。Chromeが入力します。

39
Sven Ackermann

私はこれについてブログ投稿を書きました--- GoogleのユニバーサルアナリティクストラッキングをChrome拡張機能 に追加する方法

これがその根性です:

// Standard Google Universal Analytics code
(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','https://www.google-analytics.com/analytics.js','ga'); // Note: https protocol here

ga('create', 'UA-XXXXX-YY', 'auto');
ga('set', 'checkProtocolTask', function(){}); 
ga('send', 'pageview', '/options.html');

特に強調したい点が3つあります。

  • マニフェスト.jsonファイルのリストと一致するように、スクリプトアドレスの先頭に「https」を指定します
  • 空の関数でcheckProtocolTaskをオーバーライドします
  • パスを指定して仮想ページビューを送信します– /options.html –それ以外の場合、GoogleAnalyticsはchrome-extension://gdocgfhmbfbbbmhnhmmejncjdcbjkhfc/options.htmlの形式のURLを拒否します
26
dvdsmpsn

私はちょうどこれに遭遇し、私の道をハックしたようです。これはある時点で壊れるか、完全に機能しない可能性がありますが、ここに行きます:

  • ここからGA uglified + minifiedソースコードをダウンロードします: https://www.google-analytics.com/analytics.js 、chrome拡張フォルダ。後でバックグラウンドページで読み込むことができます。

  • その中で、次のような関数を見つけます。

function Oa(){var a=M[B][E];if("http:"!=a&&"https:"!=a)throw"abort";}. 

「プロトコル」は「chrome-extension:」であり、2つではないため、これが「失敗のポイント」です。

  • したがって、この関数を次のように変更します。
function Oa(){var a=M[B][E];if("chrome-extension:"!=a&&"http:"!=a&&"https:"!=a)throw"abort";}
  • この種の「コンテンツセキュリティポリシー」をマニフェストファイルに追加し、変更したばかりのローカルバージョンのanalytics.jsを指していることを確認します。
"content_security_policy": "script-src 'self'  chrome-extension://EXTENSIONID/path/to/analytics.js;  object-src 'self'",
  • GAスニペットを、同じファイルを指すように変更します。次のようになります。
(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','chrome-extension://EXTENSIONID/path/to/analytics.js','ga');

お役に立てれば。

9
ayal gelles

Chrome Platform Analytics (CPA)を使用して、GoogleAnalyticsを起動して実行することができました。唯一の紛らわしい部分は、GAの管理コンソールでプロパティを設定する方法です。直感的ではないモバイルアプリケーションプロパティを作成する必要がありました。

また、 オプションページ を作成しました。これにより、ユーザーは必要に応じて分析を無効にして、 オプトアウト 要件に準拠できます。

お役に立てば幸いです。

2
argenkiwi

MeasurementProtocolを使用してGoogleAnalyticsと通信する方法があります。私はそのためのスクリプトを開発しました:

https://github.com/melalj/universal-ga-extension

1
melalj

新しいanalytics.js(古いga.jsとは反対)に関して、この例は私にとってはうまくいきます:

function setupGoogleAnalytics() {
  if (!window.ga) {
    (function(){
      window.ga = function() {
        (window.ga.q = window.ga.q || []).Push(arguments);
      }, window.ga.l = 1 * new Date();
      var tag = 'script';
      var a = document.createElement(tag);
      var m = document.getElementsByTagName(tag)[0];
      a.async = 1;
      a.src = 'https://www.google-analytics.com/analytics.js';
      m.parentNode.insertBefore(a, m);
    })();
    ga('create', 'UA-XXXXXXX-Y', 'auto');
    ga('set', 'checkProtocolTask', null);
  }
}

次のcontent_security_policyスニペットをmanifest.jsonに追加する必要があることに注意してください。

{
...
  "content_security_policy": "script-src 'self' https://www.google-analytics.com; object-src 'self'"
...
}