Google Analytics AJAX电子商务跟踪

时间:2014-07-25 09:54:58

标签: javascript ajax asynchronous google-analytics e-commerce

假设我有一个index.html,它启动了通用Google Analytics跟踪代码:

<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','//www.google-analytics.com/analytics.js','ga');

ga('create', 'UA-XXXXXXX-X', 'auto');
ga('send', 'pageview');
</script>

后来我加载了一个HTML文档,我通过AJAX插入。我是否可以将HTML电子商务跟踪的javascript代码放入HTML中的脚本标签中,然后通过AJAX插入,而无需先再次启动Google Analytics?所以我会有这样的事情:

通过ajax插入的HTML:

<h2>Thanks for ordering.</h2>
<script>
ga('require', 'ecommerce');
ga('ecommerce:addTransaction', {
    'id': '1',
    'revenue': '100',
    'shipping': '1'
});
ga('ecommerce:addItem', {
    'id': '1',
    'name': 'Test item name',
    'sku': 'ABC123',
    'category': 'test category',
    'price': '100',
    'quantity': '1'
});
ga('ecommerce:send');
</script>

这会跟踪正确吗?如果访问者快速关闭页面或导航到那里,可能是javascript没有被执行的可能性?

非常感谢您对如何解决这个问题的任何提示。

提前致谢!

1 个答案:

答案 0 :(得分:0)

在ajax脚本中创建电子商务代码,并在原始页面中发送网页浏览。

它有效但可能有问题,我只是没有注意到它。 :)

总的来说,它看起来像这样:


generate_ecommerce_data.php:

<?
//logic to create following data
ga('ec:addProduct', {
  'id': '{$product['sku_id']}',
  'name': '{$product['title']}',
  'brand': '{$product['brand']}',
  'category': '{$product['category']}',
  'price': '$price',
  'quantity': $quantity
});

ga('ec:setAction', 'purchase', {
  'id': '$transaction_code',
  'affiliation': 'NameName',
  'revenue': '$total_sum',
  'shipping': '$delivery_cost'
});

在呼叫页面上:

<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','//google-analytics.com/analytics.js','ga');

    ga('create', 'UA-UANUMBER', 'NameName');
    ga('require', 'ec');

$('#element').click(function(){
    $.ajax({
        type: 'POST',
        url: '/ajax/generate_ecommerce_data.php',
        success: function(response) {
            $('#container').html('<script>' + response + '<\/script>');
            ga('send', 'pageview'); 
            $('#container').html('');
        },
        error: function(err) {
            console.log(err.status);
        }
    });
});
</script>

P.S .:
看起来我超出了消息限制,需要修剪ajax代码,但你可以得到这个想法。