Referrer的重要性
HTTP请求中有一个referer的报文头,用来指明当前流量的来源参考页。例如在 www.sina.com.cn/sports/上点击一个链接到达cctv.com首页,那么就referrer就是www.sina.com.cn /sports/了。在Javascript中,我们可以通过document.referrer来获取同样的信息。通过这个信息,我们就可以知道访客是 从什么渠道来到当前页面的。这对于Web Analytics来说,是非常重要的,这可以告诉我们不同渠道带来的流量的分布情况,还有用户搜索的关键词等,都是通过分析这个referrer信息来 获取的。
但是,出于各种各样的原因,有时候Javascript中读到的referrer却是空字符串。下面总结一下哪些情况下会丢失 referrer。
Referrer丢失的几个场景
修改Location对象进行页面导航
Location 对象是一个用于页面导航的非常实用的对象。因为他允许你只变更Url的其中一部分。例如从cn域名切换到com域名,其他部分不变:
window.location.hostname = "example.com";
但 是,通过修改Location进行页面导航的方法,会导致在IE下丢失Referrer。
IE5.5+ 下返回空字符串
Chrome3.0+,Firefox3.5,Opera9.6,Safari3.2.2均正常返回来源网页
window.open 方式打开新窗口
示例:
<a href="#" onclick="window.open('http://www.google.com')">访问Google</a>
点 击此链接会在新窗口打开Google网站,我们在地址栏中输入以下js代码就可以看到发送的referrer了。
javascript:alert(document.referrer)
测 试结果:
IE5.5+ 下返回空字符串
Chrome3.0+,Firefox3.5,Opera9.6,Safari3.2.2 均正常返回来源网页
如果是同个域名下通过此方式跳转的,那么我们可以通过访问windoww.opener对象 去获取丢失的referrer信息。代码如下:
<script type="text/javascript">
var referrer = document.referrer;
if (!referrer) {
try {
if (window.opener) {
// IE下如果跨域则抛出权限异常
// Safari和Chrome下window.opener.location没有任何属性
referrer = window.opener.location.href;
}
}
catch (e) {}
}
</script>
跨 域的话则没辙了~
鼠标拖拽打开新窗口
鼠标拖拽是现在非常流行的用户习惯,很多浏览器都内置或者可以通过插件的方式来支持 鼠标拖拽式浏览。但是通过这种方式打开的页面,基本全都丢失referrer。并且,这种情况下,也无法使用window.opener的方式去获取丢失 的referrer了。
已测试:
Maxthon2.5.2,Firefox的FireGesture插 件,Chrome3.0+,Opera9.6,Safari3.2。
点击Flash内部链接
点击Flash上到达另外一 个网站的时候,Referrer的情况就比较杂乱了。
IE下,通过客户端Javascript的document.referrer读取到 的值是空的,但是如果你使用流量监控软件看一下的话,你会发现,实际上HTTP请求中的Referer报文头却是有值的,这可能是IE实现的Bug。同 时,这个值指向的是Flash文件的地址,而不是来源网页的地址。
Chrome4.0下点击Flash到达新窗口之后,Referrer也 是指向的Flash文件的地址,而不是源网页的地址。
Chrome3.0和Safari3.2是一样的,都是会丢失Referrer信息。
Opera 则和Firefox一样,Referrer的值都是来源网页的地址。
HTTPS跳转到HTTP
从HTTPS的网站跳转到 HTTP的网站时,浏览器是不会发送referrer的。这个各大浏览器的行为是一样的。
例如,我们在HTTPS下使用Google Reader或是Gmail的时候,点击某个链接去到另外一个网站,那么从技术上来说,这样的访问和用户直接键入网址访问是没有什么分别的。
Referrer 丢失对于广告流量监控的影响
Referrer如果丢失,Web Analytics就会丢掉很重要的一部分信息了,特别对于广告流量来说,就无法知道实际来源了。目前国内好多用了Google Adsense广告的网站,都使用了window.open的方式来打开广告链接,因此IE下会丢失Referrer,而我们知道,IE是目前市场份额最 大的浏览器,因此其影响是很大的。很多流量统计工具会因此将这部分流量归入“直接流量”,和用户直接键入网址等价了。
对于这样的情况,需要 让广告投放者在投放广告的时候,给着陆页面的Url加上特定的跟踪参数。
例如,某个Flash广告,点击之后到达的网址是 http://www.example.com/,为了监控此流量是从哪个渠道过来的,我们可以修改此投放的着陆Url,改成http: //www.example.com/?src=sina,类似这种方式,然后在着陆页面中使用Javascript代码提取此src参数,这样就可以得 到广告来源信息。
在投放Google Adwords的时候,后台系统有一个“自动标记”的选项,当启用此选项的时候,Google在生成所有广告的着陆页面Url的时候,就会自动加上一个 gclid的参数,这个参数能够将Google Analytics后台和Adwords广告后台的数据进行整合。这样就可以知道广告流量对应于哪个广告系列,哪个广告来源和广告关键词等信息了。和上面 提到的思路其实是类似的。只不过Google自动帮你做了Url的修改了而已。
分享到:
相关推荐
<meta name="referrer" content="always">的作用
在IE浏览器中,使用JavaScript实现页面跳转时,常常会遇到一个特定的问题:跳转后的页面无法获取到正确的上一个页面的referrer信息。这种现象被视作是IE浏览器的一个BUG。因为对于需要追踪页面来源的网站来说,...
在Android开发中,`referrer`是一个重要的概念,它用于追踪应用程序的来源,比如用户是从哪个应用或者哪个链接启动了当前的应用。`getReferrer()`方法是Android提供的一个接口,允许我们从Intent中获取调用者的引用...
这个属性对于了解用户的行为路径、统计分析、安全验证等场景非常有用。在给定的例子中,我们通过两个简单的 HTML 文件来演示了 `document.referrer` 的使用。 1. 首先,我们有一个 `a.html` 文件,其中包含一个指向...
那么,为什么我做了这个插件? 您可能会在找到原因,并希望您喜欢它。 :)区别此插件已通过所有测试用例。 且选项没有差异。 安装通过npm: npm i fastify-referrer-policy 通过纱: yarn add fastify-referrer-...
文档引用(`document.referrer`)是JavaScript中用于获取当前页面加载前的源页面URL的一个属性。这个属性对于跟踪用户导航路径,分析流量来源等用途非常重要。然而,`document.referrer`的行为在不同浏览器之间可能...
在网络安全和隐私保护方面,referrer参数的处理也是一个重要的考量因素。 从文件内容来看,我们主要关注的是Google、百度、搜搜、有道和搜狗这五大搜索引擎的referrer参数规则。 1. Google的referrer参数: 在...
当一个用户从搜索引擎的搜索结果页面跳转到一个网站,或者从一个网站的链接跳转到另一个网站时,目标网站可以通过document.referrer来获取到发起跳转的源头页面的URL。 在广告业务、用户行为分析、服务器日志记录等...
在探讨IE浏览器下document.referrer拒绝访问的解决方法之前,我们首先要了解document.referrer这个属性。在Web开发中,document.referrer是用来获取页面跳转来源的URL,即用户点击某个链接或提交表单之后所跳转到...
在流量统计服务中都有Traffic source这个功能。...更不幸的是,window.opener适用的场景不多,而document.referrer非常的弱,以至于很多场景下无法准确判断出流量来源。 document.referrer的覆盖 从使用意义上来说do
JavaScript 中的 referrer 是一个非常有用的属性,它能够帮助开发者获取当前页面的来源页面URL。简单来说,当用户从一个页面跳转到另一个页面时,新页面可以通过 referrer 访问到前一个页面的URL。这项功能在很多...
这个属性在很多场景下都有其独特的应用价值,特别是在网页分析、用户体验优化以及安全控制等方面。 首先,让我们深入了解一下 `document.referrer` 的基本用法。在网页中,当你从一个页面A点击一个链接跳转到页面B...
在Android开发中,`referrer` 是一个重要的概念,它用于追踪应用间的来源信息。当我们谈论 `getReferrer()`,这是Android中的一个API,允许应用程序获取启动它的意图(Intent)中的引用信息。`getReferrer()` 方法是...
Google Play 的 Referrer Test 是一个 Android 测试应用程序,它展示了如何将来自网站/电子邮件/广告/任何内容的“referrer”字符串传递到 Android 上的 Google Play 商店,让用户安装您的应用程序,然后让 Play ...
#猴子推荐人monkeys-referrer是用于node.js / express Web应用程序的引荐来源网址解析库。 由于缺乏维护,这是从分叉的。如何使用安装npm install monkeys-referrer --save原料药var mreferrer = require ( '...
针对这个问题,可以通过判断是否为IE浏览器,如果是,则可以使用一种技巧来保留referrer信息:即在页面上临时添加一个链接元素,并触发点击事件来保留referrer信息。 至于document.referrer的实际应用,比如在微信...