搜文章
推荐 原创 视频 Java开发 iOS开发 前端开发 JavaScript开发 Android开发 PHP开发 数据库 开发工具 Python开发 Kotlin开发 Ruby开发 .NET开发 服务器运维 开放平台 架构师 大数据 云计算 人工智能 开发语言 其它开发
Lambda在线 > 曹辰的思考笔记 > ajax回调中window.open弹窗被Chrome81拦截的解决方法

ajax回调中window.open弹窗被Chrome81拦截的解决方法

曹辰的思考笔记 2020-05-24

深夜优雅系列之二

项目中遇到的问题:

处理页面ajax请求过程中,异步请求成功后需要新开窗口打开 url,使用的是 window.open() 方法 来实现,最终都被浏览器拦截了。不会跳到对应的页面,如下

原因:浏览器之所以拦截新开窗口因为该操作不是用户主动触发的,它认为这是不安全的所以拦截了( _self 不会限制),即使 ajax 回调函数中执行 click 或者 submit 等用户行为(trigger('click')),浏览器也会认为不是由用户主动触发的,不能被安全执行,所以被拦截。


最终解决方案



解决问题过程


百度了很多方法:比如

1:下面两种封装的方法放到ajax中不起效

1function newOpenWindow(url, id) {

    var a = document.createElement(‘a‘);
    a.setAttribute(‘href‘, url);
    a.setAttribute(‘target‘, ‘_blank‘);
    a.setAttribute(‘id‘, id);
    // 防止反复添加
    if(!document.getElementById(id)) {
      document.body.appendChild(a);
    }
    a.click();
  }
2function newOpenWindow(url) {
    var a = $('<a href="'+url+'" target="_blank"></a>')[0];
    var e = document.createEvent('MouseEvents');
    e.initEvent('click', true, true);
    a.dispatchEvent(e);
  }

2:通过定时器,无效(时间长短无关)

var newOpenWindow=window.open();
setTimeout(function(){
  newOpenWindow.location=locationurl;
}, 1000);

最终的解决方法如下

var newOpenWindow=window.open('about:blank'); // 在ajax外部先打开空白新窗口

$.ajax({
  success:function(data){
    if(data){
      //window.open('http://www.jb51.net'); 这种方法会被浏览器拦截 (错误方法)
      newOpenWindow.location="http://www.baidu.com"; //异步成功之后再给新窗口的localtion赋值
   }
}
})

3:当遇到两层回调的时候,不用先弹页面的时候会出问题。

这次 解决方法:async:false, 把所有的请求都改成同步解决的,但是有隐患。

$.ajaxSetup({
async: false
});
$.post('/Handler/TalentManager.ashx?action=getApplicantByCertNoAndName',
{
sqrName: sqrName,
sqrCertNo: sqrCertNo
},
function (d) {
if (d == '') {
alert('在保对象中无此申请人!');
} else {
openNewDialog('/TalentRent/TalentRentChangeEdit.aspx?id=' + d);
}
});
$.ajaxSetup({
async: true
});

搞定收工!!!




香港脚 台湾人


欢迎关注,我的微信公共号

分享也是一种生活态度
                分享所思, 所得。

                如此而已   Write By CaoChen

                我是[香港脚台湾人],这个微信公共号(summerhins)的定位是自我提升,范围主要包括学习方法、注意力、习惯等等,同时不定期分享一些五花八门的读书笔记和影评。

                欢迎点击文章标题下方的作者关注。



  • 由于水平有限,不足和错误之处在所难免,希望大家能够批评指出。

  • 我的博客:http://www.cnblogs.com/hins/

  • 我的GitHub:https://github.com/caochenhins

  • 我的微信公共号:曹辰的思考笔记



真诚赞赏,手留余香

打赏

微信支付

 

支付宝



版权声明:本站内容全部来自于腾讯微信公众号,属第三方自助推荐收录。《ajax回调中window.open弹窗被Chrome81拦截的解决方法》的版权归原作者「曹辰的思考笔记」所有,文章言论观点不代表Lambda在线的观点, Lambda在线不承担任何法律责任。如需删除可联系QQ:516101458

文章来源: 阅读原文

相关阅读

关注曹辰的思考笔记微信公众号

曹辰的思考笔记微信公众号:enjoyhins

曹辰的思考笔记

手机扫描上方二维码即可关注曹辰的思考笔记微信公众号

曹辰的思考笔记最新文章

精品公众号随机推荐