常见一种情况,例如支付:
有如下三个页面:入口页面,填写金额页面,支付成功页面
其中支付页面在支付成功有会有一个返回上一页的按钮,点击就返回上一页,或者点击浏览器返回上一页会出现继续进入输入金额的页面。
现在解决这个问题
关键点:
history.replaceState(null, null, document.referrer);
document.referrer(改属性非常的脆弱,参考:http://driftcloudy.iteye.com/blog/986265)
location.replace
方案1:
添加中间空白页面:
agency.html,输入金额页面跳转和支付成功跳转,都是跳转到这个页面。
if(/order\.html/.test( document.referrer)){
window.location.href = window.ptDomain + "person/welfare";
}
else{
history.back();
}
切记跳转代理页面的时候不要用location.relace("xx/agency.html");
这样处理的话会把来源页面的历史记录替换成代理页面,这样就无法判断来源了
输入金额页面:
替换当前页面的历史记录为代理页面:
location.replace("./agency.html");
支付成功的页面直接:
location.history.back()
方案2,不需要中间件:
a.html
<p>我是aaaaaaaaaaaaaaaaaaa</p>
<a href="./b.html" target="_blank" rel="external nofollow" >去bbbbbbbbb</a>
b.html
<p>我是b</p>
<a href="c.html" target="_blank" rel="external nofollow" > 去ccccccccc</a>
<script>
history.replaceState(null, null, document.referrer);
console.log("后:",window.history)
</script>
C.html
<body>
<div id="wrap"></div>
<p οnclick="javascript:deleB()">我是c.html,点击跳过b</p>
<script>
function deleB(){
history.back();
}
console.log(document.referrer)
</script>
</body>
注意:
如果涉及跨域,必须使用代理的方式,history.replaceState不支持不同域名,location.replace没有跨域问题,history.replaceState和location.replace都可以删除当前页面的历史记录替换成指定的