前段時間需要通過 JavaScript 獲取頁面的來源，這個操作很簡單，使用 document.referrer 就可以獲取到了。不過，實際應用中還是有很多意外情況，這兒簡單整理一下。

首先遇到的問題，是從 HTTPS 頁面轉(zhuǎn)到 HTTP 頁面后，document.referrer 的值為空。出于安全性考慮，很多網(wǎng)站的一些重要頁面（比如淘寶的登錄頁面）都會使用 HTTPS 協(xié)議。如果某個未登錄用戶在頁面 A（HTTP 頁面）點擊了頁面 B（HTTP 頁面）的鏈接，但頁面 B 需要用戶登錄，于是先跳到登錄頁面 （HTTPS 頁面），登錄完成之后再跳回 B（HTTP 頁面），這時你會發(fā)現(xiàn) B 頁面上取不到 document.referrer 了。也就是說，如果想根據(jù) referrer 來還原用戶訪問路徑的話，如果路徑中有 HTTP 頁面也有 HTTPS 頁面，那么這個路徑就會在從 HTTPS 到 HTTP 的地方斷掉。

這個問題的根源是瀏覽器的安全策略，只靠 JavaScript 似乎沒有特別好的解決辦法。一個迂回的思路是使用 window.name，在 HTTPS 頁面將當前頁面的 url 寫到 window.name 中，再在下一個頁面（HTTP 頁面）讀取。

除了這種情況，其它頁面跳轉(zhuǎn)是否都能正常取到 document.referrer 呢？我搜索了一番，發(fā)現(xiàn) 這兒 有人整理了一個列表，不過不是很全，例如沒有包括垂而不死的 IE6 的情況。于是便自己動手，在虛擬機里裝了 N 個瀏覽器，把各種情況都測試了一下（這真是一個體力活），結(jié)果見下表：

上表中的“√”表示能正常取到 referrer，”” 表示 referrer 為空。

除了 IE 外，其它瀏覽器都是目前官網(wǎng)上能下載到的最新版本，其中 Safari 同時測試了 Windows 版和 Mac 版，結(jié)論一樣。

另外還有一些情況未做測試，例如點擊 Flash 跳轉(zhuǎn)時各瀏覽器下能否保持 referrer 等。

上表中大部分情況是符合預期的，不過似乎也有幾處需要注意的：

1、在 Safari 中，右鍵打開鏈接會丟失 referrer；
2、在 IE 中，修改 location.href 或使用 window.open 打開頁面會丟失 referrer（IE 9 有一點例外，使用 location.href 跳轉(zhuǎn)不會丟失 referrer）；
3、使用 meta 跳轉(zhuǎn)時，IE / Firefox 下會丟失 referrer。

最后，一個簡單的結(jié)論是：如果你需要通過 document.referrer 采集頁面訪問來源，最好不要使用 JS 跳轉(zhuǎn)或打開新窗口，也不要使用 meta 跳轉(zhuǎn)。

最新評論