javascript操做referer

Referrer的重要性

HTTP請求中有一個referer的報文頭,用來指明當前流量的來源參考頁。例如在www.sina.com.cn/sports/上點擊一個連接到達cctv.com首頁,那麼就referrer就是www.sina.com.cn/sports/了。在Javascript中,咱們能夠經過document.referrer來獲取一樣的信息。經過這個信息,咱們就能夠知道訪客是從什麼渠道來到當前頁面的。這對於Web Analytics來講,是很是重要的,這能夠告訴咱們不一樣渠道帶來的流量的分佈狀況,還有用戶搜索的關鍵詞等,都是經過分析這個referrer信息來獲取的。javascript

可是,出於各類各樣的緣由,有時候Javascript中讀到的referrer倒是空字符串。下面總結一下哪些狀況下會丟失referrer。html

修改Location對象進行頁面導航

Location對象是一個用於頁面導航的很是實用的對象。由於他容許你只變動Url的其中一部分。例如從cn域名切換到com域名,其餘部分不變:html5

window.location.hostname = "example.com";

可是,經過修改Location進行頁面導航的方法,會致使在IE下丟失Referrer。java

IE5.5+ 下返回空字符串git

Chrome3.0+,Firefox3.5,Opera9.6,Safari3.2.2均正常返回來源網頁github

window.open方式打開新窗口

示例:web

<a href="#" onclick="window.open('http://www.google.com')">訪問Google</a>

點擊此連接會在新窗口打開Google網站,咱們在地址欄中輸入如下js代碼就能夠看到發送的referrer了。chrome

javascript:alert(document.referrer)

測試結果:segmentfault

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的修改了而已。

IE下referer爲空的解決辦法

在IE下采用 window.location.href方式跳轉的話,referer值爲空。而在標籤裏面的跳轉的話 referer就不會空。因此,經過如下代碼就能夠解決這個IE問題

function gotoUrl(url){
     if(window.VBArray){
         var gotoLink = document.createElement('a');
         gotoLink .href = url;
         document.body.appendChild(gotoLink);
         gotoLink .click();
     }else{
       window.location.href = url;
     }
 }

禁止瀏覽器在訪問連接時不要帶上referer

咱們在從一個網站點擊連接進入另外一個頁面時,瀏覽器會在header里加上Referer值,來標識此次訪問的來源頁面。可是這種標識有可能會泄漏用戶的隱私,有時候我不想讓其餘人知道我是從哪裏點擊進來的,可否有手段可讓瀏覽器不要發送Referer呢?

  • 使用新增的html5的解決方案,使用rel="noreferrer",聲明鏈接的屬性爲noreferrer,目前只有chrome4+支持.
  • 使用中間頁面,但實際上仍是發送referrer的,好比使用Google的鏈接轉向,noreferrer.js.
  • 使用javascript協議連接中轉,參見下面的說明.

新開一個窗口,至關於target="_blank":

function open_window(link){ 
    var arg = '\u003cscript\u003elocation.replace("'+link+'")\u003c/script\u003e';
    window.open('javascript:window.name;', arg);
}

轉向到一個鏈接,至關於target="_self":

function redirect(link){ 
    var arg ='\u003cscript\u003etop.location.replace("'+link+'")\u003c/script\u003e';
    var iframe = document.createElement('iframe');
    iframe.src='javascript:window.name;';
    iframe.name=arg;
    document.body.appendChild(iframe);
}

其餘鏈接

相關文章
相關標籤/搜索