javascript的document.referrer浏览器支持、失效情况总结
在流量统计服务中都有Trafficsource这个功能。Trafficsource是针对访次级别的概念,换句话说,当访次建立的时候,landingpage的流量来源即是该访次的Trafficsource。虽然Trafficsource有很多种,不过不幸的是依据现在JS,获得Trafficsource的途径只有两种——document.referrer、window.opener.更不幸的是,window.opener适用的场景不多,而document.referrer非常的弱,以至于很多场景下无法准确判断出流量来源。
document.referrer的覆盖
从使用意义上来说document.referrer希望能够追踪到的是浏览器端行为。如果一张页面A被打开,那么浏览器端可能会发生的动作有用户操作、JS代码两种。
先来看看用户打开页面A可能会进行的操作:
注意这里的link即指<A>标签,但是如果有事件或者target还要另当别论。
JS打开页面可能的方式:
上面列出了客户端打开页面的一些方法,此外,如果通过服务端的重定向技术,也能够使得页面A呈现给访客。
下面来针对具体的浏览器测试,如果是上述的这些情况,document.referrer表现如何:
其中,""表示一个空的字符串,√表示能够正确判断来源页,保持则意味使用前进后退不会改变页面的referrer。从这张表里可以看出document.referrer能覆盖大约一半的case。但是对于一些比较常用的操作,例如利用鼠标拖动link至标签栏、前进后退等情况还不能做出正确的处理。
document.referrer的来源
浏览器在向server请求页面A的时候,会发送HTTP请求。这个请求的Header里会带上Referer属性,server接收到该请求后,可以提取出Header里的Referer,用于判断访客是从哪个页面发起的请求。
一般情况下浏览器请求A时发送的Header中Referer是什么,那么拿到A页面后document.referre的值就是什么。上图是一个请求A页面的Header,A的document.referre为http://localhost/Test/b.html。
如果在Header中不包含Referre,那么用document.referre去取的时候,就会被赋值为空字符串。
关于HTTPS请求
如果在一张普通的HTTP页面上点击了HTTPS的链接,那么在https请求头部可以附上Referer信息,之后在HTTPS页面中依然可以用document.referre来获得普通的http页面。
同样,如果是在一张https页面上点击了另一个HTTPS的链接,可以在请求的头部附上Referer信息。
但是如果是从一张https页面点击了http链接,那么很不幸,发送的http请求头里无法包含关于https页面的信息,这可能是出于一种对https页面的保护措施。
伪造Referer信息
根据上文的描述,document.referre源自于Header中的Referer。那么如果想修改document.referre的值,理论上讲,仅需要修改请求Header。可以将Header中现有的Referer替换成自己想要的值,如果原来没有也可以添加Referer。
在客户端,篡改Header是一件非常容易的事情。在一个页面的http请求发出去之前,可以利用截包工具将其拦截,然后分析出头部信息,并且修改Referre。
搜了一下,对于FireFox可以使用RefControl插件方便的进行修改。总之,欺骗Trafficsource是轻而易举的事情。
页面强制Refresh
写完不久就发现遗漏了一种页面跳转的方式,即在html中的meta标签里强制指定页面进行refresh。例如在b.html中写入
则过5秒后浏览器会自动向server发起a页面请求。
经过测试,在IE8,FF3.6-FF4.0中,均不会带有Referer信息,但是chrome却能够鬼使神差的把b.html作为Referer添加进头部。
相关文章
- JavaScript禁用浏览器后退按钮
- javascript html转换成markdown,如何使用Turndown使用JavaScript将HTML转换为Markdown[通俗易懂]
- 微软为大型 JavaScript 应用而开发的 TypeScript 发布了 2.0 版本
- 在IE,Firefox,Safari,Chrome,Opera浏览器上调试javascript
- 一个类似vbscript的round函数的javascript函数
- JavaScript验证浏览器是否支持javascript的方法小结
- Javascript+XMLHttpRequest+asp.net无刷新读取数据库数据
- javascript跨浏览器的事件系统
- javascript语言结构小记(一)
- 通过JavaScript控制字体大小的代码
- 深入理解JavaScript系列(14)作用域链介绍(ScopeChain)
- javascript高级程序设计第二版第十二章事件要点总结(常用的跨浏览器检测方法)
- JavaScript快速检测浏览器对CSS3特性的支持情况
- 原生javascript和jquery判断浏览器版本等信息
- javascript:文字不间断向左移动的实例代码
- javascript相等运算符与等同运算符详细介绍
- 讨论html与javascript在浏览器中的加载顺序问题
- javascript获取浏览器类型和版本的方法(js获取浏览器版本)
- javascript获取函数名称、函数参数、对象属性名称的代码实例
- Javascript学习笔记之对象篇(四):forin循环
- JavaScript修改浏览器tab标题小技巧
- javascript浏览器窗口之间传递数据的方法
- JavaScript立即执行函数的三种不同写法
- JavaScript拆分字符串时产生空字符的解决方案