JS获取上一访问页面URL地址——（上）

在之前的文章 http://blog.csdn.net/amberwu/article/details/72876635提过一嘴关于js获取浏览器上一浏览页面地址代码是

document.referrer

，今天看大神张鑫旭的文章，对这个问题做一个深层研究 。

文章参考自：http://www.zhangxinxu.com/wordpress/?p=5957

一. 介绍介绍

获取上一个页面的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；