2018-04-24 ajax打开新标签/新窗口被浏览器拦截(非
2018-04-24 本文已影响62人
anyangdp
1.拦截原理分析
针对有ajax等异步请求内,操作打开页面,这是浏览器不允许的,浏览器允许用户操作,不允许异步操作。想跳过拦截,就得满足浏览器的要求(如有错误,可以指正,评论处留言)
2.实际测试成功的方式(非添加a标签跳转,非form,这些经过测试,在异步ajax内部做的任何跳转操作都会被拦截)
html
<p onclick="pay()">付款</p>
js(我用的是angular,对应的语言用了ts。)
function pay() {
// 在异步请求之前,打开新的标签页
// let 这里可以当作var来看待,实际上是有差别的,暂时可以这么理解。
let aliPayWindow = window.open("about:blank");
// 类似与$.ajax()等异步请求方法,异步请求里面js控制跳转会被浏览器拦截
this.payOrderService.create(payOrder).subscribe(data => {
let aHref = this.payOrderService.getBaseURL() + '/pay/' + data.id;
//异步请求之后执行相关方法,在新的标签页里面做当前页面跳转,焦点定位在当前页面
//新页面跳转,及聚焦操作
aliPayWindow.location.href = aHref;
aliPayWindow.focus();
//原页面弹窗提示
Layer.alert('请在弹出页面完成支付!',() => window.location.reload());
});
}