美文网首页我爱编程
2018-04-24 ajax打开新标签/新窗口被浏览器拦截(非

2018-04-24 ajax打开新标签/新窗口被浏览器拦截(非

作者: anyangdp | 来源:发表于2018-04-24 10:57 被阅读62次

    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());
         });
    
    }
    

    相关文章

      网友评论

        本文标题:2018-04-24 ajax打开新标签/新窗口被浏览器拦截(非

        本文链接:https://www.haomeiwen.com/subject/inbdlftx.html