VUE增加百度统计以及失效问题解决

Scok 2021-03-02 13:23:00
原文地址:https://www.cnblogs.com/Scooby/p/14468420.html

VUE增加百度统计以及失效问题解决

添加百度统计代码

在main.js中添加下面代码即可。

/*
*   百度统计代码
*
*
*/
var _hmt = _hmt || [];
window._hmt = _hmt; // 必须把_hmt挂载到window下,否则找不到
(function() {
  var hm = document.createElement("script");
  hm.old-src = "https://hm.baidu.com/hm.js?XXXXXXXXXXX";  
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();

百度统计代码失效

解决方案

<!-- index.html文件  -->
<!-- 修改referrer属性为origin-when-cross-origin  -->   
<meta name="referrer" content="origin-when-cross-origin">

原因分析

Referrer-Policy默认属性为no-referrer,可能会导致一些第三方的统计代码失效,比如cnzz,百度统计,解决方法

1.更改该属性为origin-when-cross-origin

2.使用iframe包裹一层,用一个独立的html页面加载统计代码。

Referrer-Policy常见使用方法

你也可以在 HTML 内设置 referrer 策略。例如,你可以用一个 name 为 referrer 的 <meta> 元素为整个文档设置 referrer 策略。

<meta name="referrer" content="origin">

或者用 <a><area><img><iframe><script>或者 <link>元素上的 referrerpolicy 属性为其设置独立的请求策略。

<a href="http://example.com" referrerpolicy="origin">

另外也可以在 <a><area> 或者 <link>元素上将 rel 属性设置为 noreferrer

<a href="http://example.com" rel="noreferrer">

详细MDN文档:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Referrer-Policy

声明:该文章系转载,转载该文章的目的在于更广泛的传递信息,并不代表本网站赞同其观点,文章内容仅供参考。

本站是一个个人学习和交流平台,网站上部分文章为网站管理员和网友从相关媒体转载而来,并不用于任何商业目的,内容为作者个人观点, 并不代表本网站赞同其观点和对其真实性负责。

我们已经尽可能的对作者和来源进行了通告,但是可能由于能力有限或疏忽,导致作者和来源有误,亦可能您并不期望您的作品在我们的网站上发布。我们为这些问题向您致歉,如果您在我站上发现此类问题,请及时联系我们,我们将根据您的要求,立即更正或者删除有关内容。本站拥有对此声明的最终解释权。