document.referrer和history.go(-1)退回上一页区别

javascript:location=document.referrer;和javascript:history.go(-1);区别：

返回上一页，在PC端我们可以使用：history.go(-1)或者history.back()，可以正常返回第一层。这样，我们不需要上一页的 url 具体是什么，只要使用 history 一般都没啥问题。

但是在移动端，如果想要返回上一页。比如从A页面跳到B页面，如果B页面想返回A页面，为了防止不会跳错，必须要有一个 < 按钮，给它加 history.go(-1) ，返回上一层。

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

那如果我们没有返回上一页的 < 的按钮，在手机上怎么操作才会返回上一页，比如：从微信分享进来的，进入的是微信内页，此时，内页就是第一页，它没有上一页，要怎么返回？这时点返回按钮是没有反应的，不是一个好的用户体验，十有八九的人会误以为是BUG，这绝对是个坑爸的问题。

移动端无论是原生app还是传统的网页，返回上页是一个比较强烈的需求。

javascript 有一个可以获取前一页面的URL地址的方法：document.referrer

document.referrer 的来源

referrer 属性可返回载入当前文档的文档的 URL【摘自W3CSHCOOL】, 如果当前文档不是通过超链接访问的，那么当前文档的URL为NULL，这个属性允许客户端的 javascript 访问 HTTP 头部；
referrer 属性，我们可以从 http 头部获取

无法获取 referrer 信息的情况

下面的场景无法获得 referrer 信息，以下前8条属于：

直接在浏览器中输入地址
使用location.reload()刷新（location.href或者location.replace()刷新有信息）
在微信对话框中，点击进入微信自身浏览器
扫码进入微信或QQ的浏览器
直接新窗口打开一个页面
从https的网站直接进入一个http协议的网站（Chrome下亲测）
a标签设置rel="noreferrer"（兼容IE7+）
meta标签来控制不让浏览器发送referer
点击 flash 内部链接
Chrome4.0以下，IE 5.5+以下返回空的字符串
使用修改 Location 进行页面导航的方法，会导致在IE下丢失 referrer，这可能是IE的一个BUG
跨域
```
<meta content="never" name="referrer">
```

怎么解决无法获取 referrer 的情况，还没有很好的方法，尽量避免吧。

转载于:https://www.cnblogs.com/xiaozhouyuxiaohou/p/9211783.html

document.referrer和history.go(-1)退回上一页区别相关推荐

微信中苹果h5页面用window.history.go(-1)返回上一页页面不会重新加载/刷新
微信中h5页面用window.history.go(-1)返回上一页页面不会重新加载问题问题描述:在实际开发中遇到这样一个问题,业务需求涉及到返回上一页问题,第一时间想到了window.history ...
ant design pro,删除最后一页退回上一页
首先需要三个变量,分别是删除后的总数以及页码还有每页条数: var nowDatasSize: number = -1var currentPage: number = 1;var pageSize: ...
前端小知识：返回浏览器上一页（back、go、referrer）
官方文档(document.referrer): https://developer.mozilla.org/zh-CN/docs/Web/API/Document/referrer 官方文档(h ...
lt;a href=quot;javascript:history.back();quot;gt;返回上一页lt;/agt;
Code: <a href="javascript:history.back();">返回上一页</a> (history.back()原页表表单中的内容会 ...
html实现返回上一页的几种方法（javaScript:history.go(-1);）
html实现返回上一页的几种方法(javaScript:history.go(-1);) 一.总结: 1.javaScript:history.go(-1); 二.方法 1.通过超链接返回到上一页 & ...
html5返回上一页不刷新,javascript解决在safari浏览器中使用history.back()返回上一页后页面不会刷新的问题...
我们知道,在JavaScript中提供了一个window.history.back()方法用于返回上一页,另外也可以使用window.history.go(-1)返回上一页(跳转). 在其他的主流浏览 ...
js返回上一页并刷新代码整理转
返回上一页并刷新在此功能有利于用户的体验,是每一个web开发人员所必备的一项,长话短说,今天介绍实现此功能的一个方法,需要了解的朋友可以参考下一:JS 重载页面,本地刷新,返回上一页复制代码代码 ...
js返回上一页并刷新代码整理
一:JS 重载页面,本地刷新,返回上一页复制代码代码如下: <a href="javascript:history.go(-1)">返回上一页</a> ...
js返回上一页并刷新
window.history.go(-1);//返回上一页不刷新 window.location.href = document.referrer;//返回上一页并刷新转载于:https://www ...

document.referrer和history.go(-1)退回上一页区别

document.referrer和history.go(-1)退回上一页区别相关推荐

最新文章

热门文章