Barba.js AJAX站点虚拟页面视图未在GA（GTAG）中统计的问题

你遇到的核心问题是代码里用的是旧版Analytics.js（ga()）的语法，但你的网站实际使用的是新版Global Site Tag（gtag.js）——这两套API完全不兼容，所以ga('send')根本不会被执行，hitCallback自然也不会触发。

另外还有一个细节问题：Barba.js的AJAX导航不会触发$(document).ready事件，你当前的代码触发时机也不对，得绑定到Barba专属的导航钩子上。

1. 确认你的GTAG初始化代码 #

先检查页面头部的GTAG代码，应该是类似这样的（替换成你的实际跟踪ID）：

<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-XXXXXXXXX-X"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'UA-XXXXXXXXX-X');
</script>

如果这段代码存在，说明你确实在用gtag.js，必须用对应的API发送虚拟页面视图。

2. 修改GA虚拟页面视图代码 #

把原来的init_analytics()函数替换成gtag兼容的版本（路径提取逻辑可以保留，先确保路径取值正确）：

function init_analytics() {
  // 提取页面路径的逻辑
  var full_path = window.location.href;
  var path_split = full_path.split(".com");
  var ga_page_path;

  if (path_split[1] && path_split[1] != "/") {
    var path = path_split[1];
    var last_char = path[path.length - 1];
    ga_page_path = last_char == "/" ? path.slice(0, -1) : path;
  } else {
    ga_page_path = "/";
  }

  // 用gtag语法设置页面路径并发送页面视图
  gtag('set', 'page_path', ga_page_path);
  gtag('event', 'page_view', {
    'page_path': ga_page_path,
    'hitCallback': function() {
      console.log('--> hit sent <--');
    }
  });
}

3. 绑定到Barba.js的正确导航时机 #

Barba.js的AJAX导航完成后，不会触发$(document).ready，所以你需要把初始化逻辑绑定到Barba的enter钩子上，比如：

barba.init({
  transitions: [{
    enter(data) {
      // 进入新页面后执行初始化操作
      init_on_each_new_page();
    }
  }]
});

这样每次Barba完成页面切换后，都会自动调用init_analytics()发送虚拟页面视图。

• 安装Chrome的Google Analytics Debugger扩展，开启后可以在控制台查看GA请求的详细日志，快速定位错误原因
• 在init_analytics()里先添加console.log(ga_page_path)，确认提取的页面路径是符合预期的
• 检查控制台是否有gtag is not defined的报错，如果有，说明GTAG初始化代码没有正确加载

内容的提问来源于stack exchange，提问作者kebarriere