1. 程式人生 > >JS獲取上一訪問頁面URL地址——(上)

JS獲取上一訪問頁面URL地址——(上)

一. 介紹介紹
獲取上一個頁面的URL地址,前後端都可以做,前端用js就是document.referrer,後端PHP的是$_SERVER['HTTP_REFERER']

之前給pc端做活動頁面,未登入使用者要點選button跳轉到登陸頁面,登陸成功要跳轉回活動頁面才對,但是之前沒有做這個功能,我就搜了一下發現js可以實現。

但是之前都沒怎麼用過這個功能,大神幫我找到了原因:

1、後端小夥伴幫我們搞定了相關需求;
2、只有一些訪問資料統計指令碼才非常在意上一個訪問頁面的url地址是什麼;
3、如果我們希望實現的功能是返回上一頁,可以使用history.go(-1)或者history.back(),我們並不需要知道上一個訪問頁面具體的地址是什麼。

先舉個history.go的例子。

<a href="javascript:history.go(-1)">返回</a>

這個方法可以滿足大部分的互動需求,但是如果沒有上一頁的地址,這樣按返回button的時候,就失效,會造成很不好的使用者體驗,所以當取不到上頁的連結時,我們做一下處理:

if (document.referrer === '') {
    // 沒有來源頁面資訊的時候,改成首頁URL地址
    $('.demo').attr('href', '/');
}

二. 哪些場景下無法獲得上一頁referrer資訊
1、直接在瀏覽器位址列中輸入地址;
2、使用location.reload()

重新整理(location.href或者location.replace()重新整理有資訊);
3、在微信對話方塊中,點選連結進入微信自身的瀏覽器;
4、掃碼進入QQ或者微信的瀏覽器;
5、直接新視窗開啟一個頁面;
6、從https的網站直接進入一個http協議的網站(Chrome下親測);
7、a標籤設定rel="noreferrer"(相容IE7+);
8、meta標籤來控制不讓瀏覽器傳送referer;