SPA環境におけるPV重複計測の防止設定

現象

SPAではページが変わってもPtengineの基本タグが再度読み込まれず、PVが正しく計測されないため、PtengineのsetPVTagを利用することでPVを手動で発火し計測する必要があります。しかし例えばページ刷新やその他の場合でページが更新される場合、基本タグと設定したsetPVTag が同時に発火され、PVが重複して計測されるケースがあります。

上記のように重複して発火されることを回避するためには、以下の方法で対応する必要があります。

ロジック

基本タグもしくはsetPVTagが発火する際に、変数pt_spa_trigger_markを利用することでクッキーにアドレスバーのURLと発火タイミングを記録します。更に次回ページ更新された際にクッキーで記録した内容を元に、setPVTagを発火させるかを判断しコントロールします。

GTMでの設定方法

• 1基本タグを以下のように修正し、GTMで設定されているタグを差し替えてください。「xxxxxxxx」はプロジェクトidで、プロジェクト毎に異なるので、ご注意ください。

<script src="<https://js.ptengine.jp/xxxxxxxx.js>">
document.cookie="pt_spa_trigger_mark="+location.href+"ptengine"+new Date().getTime();
</script>

• 2setPVTagを以下のように修正し、GTMで設定されているsetPVTagを差し替えてください。設定完了後保存しGTMを公開します。

<script>
try{
    function getCookie(key){
      var str = document.cookie;
      var arr = str.split(";");
        for(var i=0;i<arr.length;i++){
            var data = arr[i].split("=");
              if(data[0].trim() === key){
                    return data[1];
               }
        }
    }
    if(getCookie("pt_spa_trigger_mark")){
        var pt_mark = getCookie("pt_spa_trigger_mark").split("ptengine");
        if(pt_mark[0] === location.href && (new Date().getTime() - parseInt(pt_mark[1])) > 3500){
            window._pt_sp_2 && window._pt_sp_2.push('setPVTag,'+ location.href +',replace');
            document.cookie = "pt_spa_trigger_mark="+location.href+"ptengine"+new Date().getTime();
        }else if(pt_mark[0] != location.href && (new Date().getTime() - parseInt(pt_mark[1])) > 3000){
            window._pt_sp_2 && window._pt_sp_2.push('setPVTag,'+ location.href +',replace');
            document.cookie = "pt_spa_trigger_mark="+location.href+"ptengine"+new Date().getTime();
        }
    }else{console.log("not found pt_trigger")}
}catch(e){console.log(e)}
</script>

手動設定

以下タグを手動で設定することも可能ですが、設定する際に技術の方に依頼してください。

• 1基本タグを以下のように修正しサイトへ貼り付けてください。「xxxxxxxx」はプロジェクトidで、プロジェクト毎に異なるので、ご注意ください。

<script src="<https://js.ptengine.jp/xxxxxxxx.js>">
document.cookie="pt_spa_trigger_mark="+location.href+"ptengine"+new Date().getTime();
</script>

• 2setPVTagを以下のように修正し、ページが更新される度に発火するように、直接サイトロジックへ追加してください。

try{
    function getCookie(key){
      var str = document.cookie;
      var arr = str.split(";");
        for(var i=0;i<arr.length;i++){
            var data = arr[i].split("=");
              if(data[0].trim() === key){
                    return data[1];
               }
        }
    }
    if(getCookie("pt_spa_trigger_mark")){
        var pt_mark = getCookie("pt_spa_trigger_mark").split("ptengine");
        if(pt_mark[0] === location.href && (new Date().getTime() - parseInt(pt_mark[1])) > 3500){
            window._pt_sp_2 && window._pt_sp_2.push('setPVTag,'+ location.href +',replace');
            document.cookie = "pt_spa_trigger_mark="+location.href+"ptengine"+new Date().getTime();
        }else if(pt_mark[0] != location.href && (new Date().getTime() - parseInt(pt_mark[1])) > 3000){
            window._pt_sp_2 && window._pt_sp_2.push('setPVTag,'+ location.href +',replace');
            document.cookie = "pt_spa_trigger_mark="+location.href+"ptengine"+new Date().getTime();
        }
    }else{console.log("not found pt_trigger")}
}catch(e){console.log(e)}