从URL中删除UTM参数

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了从URL中删除UTM参数相关的知识,希望对你有一定的参考价值。

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

假设我的网址看起来像这样

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

我想清理网址。期望的结果是

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; ?>

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

也许甚至有更好的解决方案来解决我的问题?

答案

这是我提出的一个解决方案,它使用History APIutm_开始从URL中删除任何查询参数。重要的是在使用utm参数将网页浏览数据发送到Google Analytics后更改网址。为此,我们使用ga函数with a callback并在调用ga('send', 'pageview')之后将其放置,这通常是Google Analytics跟踪代码段的最后一行。我使用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);
    }
  }
});
另一答案

如果要从网址中删除所有查询数据,可以按照此处的建议拆分?标记上的网址字符串:Remove querystring from URL

以上是关于从URL中删除UTM参数的主要内容,如果未能解决你的问题,请参考以下文章

打开灯箱后,从data-textval向URL添加参数

Power Apps 中 URL 中的查询字符串

html 在字段中使用URL UTM参数 - 无需动态文本替换

ini Nginx:没有utm_ *参数的代理缓存(删除查询参数,删除utm标签nginx)

尽管手动测试成功,但通过重力表单从 Google 广告点击中捕获的 UTM 参数仍然无效

VUEJS-如何从 url 中删除参数