Google 애널리틱스에 임의의 경로와 제목으로 ga('send','pageview') 할 때의 주의점

요약

페이지 뷰를 보내는 처리를 익명 함수에 쓰고,
ga를 인수에 건네주어 로컬 스코프로 하면(자), 잘 날리지 않았고,
그래서 메모.

설명

Google Analytics(유니버설 애널리틱스)에서 내장 코드를 그대로 사용하면 페이지를 로드할 때 해당 페이지의 서버 루트 경로와 <title>로 설정된 제목이 페이지 뷰로 전송됩니다.

하지만, 임의의 타이밍에 pageview를 송신하고 싶을 때, 또 같은 html로 모달상등에서 컨텐츠를 표시할 때에도 마찬가지로 pageview를 송신하고 싶을 때는,

ga('send', 'pageview', {
  'page' : 任意のパス,
  'title': 任意のタイトル
});

와 같이, 'page' 와 'title' 에 임의의 정보를 덧쓰기해 송신합니다 1 .

코드 예

pageview 전송 처리

(function(window, path) {

  window.sendAnalytics = function sendAnalytics(id, name) {
    //カスタムのpageとtitleでpageview送信
    if(id && name) {
      var page  = path + "?id=" + id,
          title = window.document.title + ":" + name;
      ga('send', 'pageview', {
        'page'  : page,
        'title' : title
      });
    }
    //通常のpageview送信
    else {
      ga('send', 'pageview');
    }
  }

})(this, location.pathname);

실행측

(function(window) {

  //ページ読み込み時に通常のpageviewを送信
  window.sendAnalytics();

  //同htmlでコンテンツを表示するボタンがクリックされた時にはコンテンツを識別できるパスとタイトルを付与してpageview送信
  $('.btn').on('click', function(){
    window.sendAnalytics('hoge', 'ほげ');
    return false;
  });

})(this);

결과

페이지를로드 할 때 (일반 pageview 전송)



같은 html로 콘텐츠를 표시했을 때 (사용자 정의 경로와 제목으로 pageview 제출)

흠집

최초로, 글로벌 스코프의 ga 를 그대로 사용하는 것은... 타이밍의 pageview 송신이 날지 않았다(펑션 자체는 발화하고 있었습니다만) 때문에 이후 조심한다.

이렇게하면 클릭 할 때 pageview가 날지 않았습니다.

(function(window, path, _ga) {

  window.sendAnalytics = function sendAnalytics(id, name) {
    //カスタムのpageとtitleでpageview送信
    if(id && name) {
      var page  = path + "?id=" + id,
          title = this.document.title + ":" + name;
      _ga('send', 'pageview', {
        'page'  : page,
        'title' : title
      });
    }
    //通常のpageview送信
    else {
      _ga('send', 'pageview');
    }
  }

})(this, location.pathname, ga);

page는, 해시(#)를 뒤에 붙여 고유화해도 Google Analytics의 리포트상에서는 잘려 버리는 것 같기 때문에, Google의 도움말에 쓰여져 있듯이 ga 등 쿼리 스트링으로 할까 ?id=hoge 슬래시로 자르는 것이 좋을지도. ↩