Google Analyticsで何でもカウント
ある特定の操作をした人が何人いるのか知りたい。
その操作が行われた時に自分の書いたJavaScriptプログラムから直接Google Analyticsを呼び出してイベントを記録することができる。
この機能はいろいろ凝った使い方ができるが、シンプルに回数をカウントするならこれだけでいい
tswindow.gtag("event", "harvest");harvestの部分は自分がつけたわかりやすいイベントの名前
JavaScriptの人は
window. がなくても動くと思うこれがGoogle AnalyticsのEngagementのページにこう表示される
そこからたどっていくと、いつどれくらい使われたかがわかる
---
詳しい話
このgtagって関数は最初にGoogle Analyticsの設定をした時にHTMLに貼り付けるように指示されたコードの中で定義されている
dataLayerってリストに追加しているだけ
たぶんこのリストの中身を定期的にチェックしてサーバに送る仕組みになってるのだろう
html <script async src="https://www.googletagmanager.com/gtag/js?id=G-GBX75RXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-GBX75RXXXX');
</script> マニュアルの記述
3つ目の引数で色々追加の情報を送れるようだ
何かを適切に設定しないといけないのかと思って混乱したが、回数をカウントするだけなら省略して良い
jsgtag('event', <action>, {
'event_category': <category>,
'event_label': <label>,
'value': <value>
});jsgtag('event', 'screen_view', {
'app_name': 'myAppName',
'screen_name': 'Home'
});プロパティ追加について
プロパティって「属性」かと思って混乱したが、Google Analytics用語としてはアカウントの直下に複数個持つことができる情報をまとめる単位のようだ
新しいウェブサービスを作ったらプロパティも追加する、というイメージか
TypeScriptではgtagの型が不明だとエラーになるので下記のように宣言する
index.tsdeclare global {
interface Window {
gtag: (
a: string,
b: string,
c?: { event_category?: string; event_label?: string; value?: number }
) => unknown;
}
}---
イベントの設定をしないといけないのかと混乱したが、しなくていいようだ
