从 URL 中删除 UTM 参数答案

【问题标题】：Remove UTM Parameters from URL从 URL 中删除 UTM 参数
【发布时间】：2018-07-08 11:18:10
【问题描述】：

我使用 UTM 参数来跟踪 Google Analytics 中的传入链接。

假设我的网址如下所示

https://www.domain.tld/shop?utm_source=newsletter&utm_medium=email&utm_campaign=spring_sale

我想清理 URL。想要的结果是

https://www.domain.tld/shop

在网上我找到了以下snippet

(function() {
    var win = window;
    var removeUtms = function(){
        var location = win.location;
        if (location.search.indexOf('utm_') != -1 && history.replaceState) {
            history.replaceState({}, '', window.location.toString().replace(/(\&|\?)utm([_a-z0-9=]+)/g, ""));
        }
    };
    ga('send', 'pageview', { 'hitCallback': removeUtms });
})();

目前我的 CMS 中的 Google Analytics 模板如下所示

<?php
    /**
     * To use this script, please fill in your Google Analytics ID below
     */
    $GoogleAnalyticsId = 'UA-bla-bla';
    /**
     * DO NOT EDIT ANYTHING BELOW THIS LINE UNLESS YOU KNOW WHAT YOU ARE DOING!
     */
    if ($GoogleAnalyticsId != 'UA-XXXXX-X' && !BE_USER_LOGGED_IN && sha1(session_id() . (!Config::get('disableIpCheck') ? Environment::get('ip') : '') . 'BE_USER_AUTH') != Input::cookie('BE_USER_AUTH')): ?>
    <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','https://www.google-analytics.com/analytics.js','ga');
      ga('create', '<?php echo $GoogleAnalyticsId; ?>', 'auto');
      <?php if ($GLOBALS['TL_CONFIG']['privacyAnonymizeGA']): ?>
        ga('set', 'anonymizeIp', true);
      <?php endif; ?>
      ga('send', 'pageview');
    </script>
<?php endif; ?>

...我不知道如何将这些代码组合在一起。

也许我的问题有更好的解决方案？

【问题讨论】：

你想只在 javascript 中处理它，还是在 php 本身中处理它？
有什么区别？对于用户来说是一样的，不是吗？
我们用 PHP 处理它，因为它还允许我们捕获 utm 数据并将其存储在数据库中，以便在我们端进行进一步的度量处理。然后我们将标头位置重定向到干净的 url。仅在 javascript 中执行所有 ajax 调用真的很痛苦（有些用户愚蠢地关闭了 js）。所以有区别。但听起来你只是想让 GA 处理这一切，所以是的，使用 javascript 方法。
嗯，我明白了，但就我而言，它非常简单：我想将存储在 UTM 中的信息发送到 Google Analytics，然后我想要一个干净的 url。
我以前从未听说过这个。因此，如果我使用 GA 将?utm_source=newsletter&utm_medium=email&utm_campaign=spring_sale 添加到任何网站的任何网址，它会自动删除查询字符串吗？你确定吗？来源？

标签： javascript php regex google-analytics

【解决方案1】：

这是我想出的一个解决方案，它使用History API 从以utm_ 开头的URL 中删除任何查询参数。重要的是在页面视图数据使用 utm 参数发送到 Google Analytics（分析）之后更改 URL。为此，我们使用ga 函数with a callback 并将其放在对ga('send', 'pageview') 的调用之后，这通常是Google Analytics（分析）跟踪sn-p 的最后一行。我使用了history.replaceState 而不是history.pushState，这样如果用户导航回这个页面，utm 参数就不会再出现了。这基本上假设您只想报告带有 utm 参数的请求一次。我相信这适合大多数情况。我进行了功能检查，因此如果浏览器不支持history.replaceState，它将什么也不做。

// -- Google Analytics tracking snippet here --
// ...
// ga('send', 'pageview');

/**********************************************************************
 * add the following code after the Google Analytics tracking snippet *
 **********************************************************************/

// remove utm_* query parameters
ga(function() {
  function paramIsNotUtm(param) { return param.slice(0, 4) !== 'utm_'; }
  if (history && history.replaceState && location.search) {
    var params = location.search.slice(1).split('&');
    var newParams = params.filter(paramIsNotUtm);
    if (newParams.length < params.length) {
      var search = newParams.length ? '?' + newParams.join('&') : '';
      var url = location.pathname + search + location.hash;
      history.replaceState(null, null, url);
    }
  }
});

【讨论】：

【解决方案2】：

如果您想从 url 中删除所有查询数据，您可以按照此处的建议在 ? 符号上拆分 url 字符串：Remove querystring from URL

【讨论】：

是的，我想从 url 中删除所有查询数据（在 Google Analytics 获得信息之后）。