Google AnalyticsをWebViewで使う
GoogleAnalyticsをインアプリブラウザで呼び出して使うのにハマったので備忘録。
普通はネイティブのGoogleAnalytics使えばいいと思いましょうが、いろいろ事情があるんですよ。。。
最初に結論
<script>
(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','__gaTracker');
__gaTracker('create', 'UA-00000000-1', {'cookieDomain':'none', 'storage':'none', 'appName':'HOGE'});
__gaTracker('set', 'checkProtocolTask', function(){} );
__gaTracker('set', 'forceSSL', true);
__gaTracker('send', 'pageview');
__gaTracker( function(tracker){ HOGEOBJ.analytics = tracker } )
で動いた。
前提
- インアプリブラウザ上で動いてるオレオレフレームワークにGoogleAnalyticsを組み込みたい。
- ネイティブ側にはあんまり手が出せない。
- iPhone、Androidで共通コンテンツ。
- デバッガなんか使えない。
- 察して。
ミソ
- インアプリブラウザで開くコンテンツ
- ローカルファイル扱いになる(プロトコルがFile)
- iOSはMac版Safari、AndroidはMac版Chromeで動けば 実機でもほぼ大丈夫っぽい雰囲気
やったこと
- 普通に組み込む
→ 普通に動かない。
- とりあえず名前を変える
gaなんて他と容易にぶつかりそうなのは嫌だ。
(window,document,'script','//www.google-analytics.com/analytics.js','__gaTracker');
- 読み込むスクリプトのURLにプロトコルを明記
そのままだとページのプロトコルになるっぽい。
file://じゃ当然に読み込めない。
(window,document,'script','https://www.google-analytics.com/analytics.js','__gaTracker');
- cookieDomainの指定
ローカルで動かす時はnoneにしろとかいてあるのでそうする。
__gaTracker('create', 'UA-00000000-1', {'cookieDomain':'none'});
- forceSSLの指定
SSL使っといたほうが無難な気がするのでそうする
__gaTracker('set', 'forceSSL', true);
- checkProtocolTaskの指定
プロトコルチェックが邪魔なので、空の関数で上書き。
nullでもいいっぽい。
__gaTracker('set', 'checkProtocolTask', function(){} );
ここまでで、iOSでは動いた。
が、問題はAndoridとかいうやつ。
- storageの指定
いろいろ追っかけてたら、chromeだとstorageなしにしないと動かないらしい。
__gaTracker('create', 'UA-00000000-1', {'cookieDomain':'none', 'storage':'none'});
おわり
後から考えると、__gaTrackerって別にTrackerオブジェクトじゃないから名前おかしいじゃん。
まあいっか・・・