如何防止谷歌浏览器阻止我的弹出窗口?

2022-01-20 00:00:00 google-chrome popup javascript popup-blocker

在我的网站上，有一个按钮仅用于调用调用 window.open 的函数，但是，最近需要进行调整以在打开弹出窗口之前进行服务器端检查.

On my website there is a button that just used to call a function that calls window.open, however, recently an adjustment was needed to do a server-side check before the popup was opened.

自从添加了执行 AJAX 调用的代码后，浏览器就会阻止在 AJAX 调用的 success 回调中打开的弹出窗口.我读到如果用户点击事件没有调用浏览器可能会阻止弹出窗口，所以我尝试将 AJAX 请求设置为 async: false，这解决了 Firefox 中的问题，但谷歌浏览器仍然阻止我的弹出窗口.有没有办法解决这个问题?

Ever since the code was added that does the AJAX call, browsers blocks the popup, that is opened in the success callback of the AJAX call. I read that browsers might block the popup if it's not called by a user click event, so I tried setting the AJAX request to async: false, which solved the problem in Firefox, but Google Chrome still keeps blocking my popup. Is there any way to get around this?

我可以将服务器端检查移至在弹出窗口中打开的页面，但如果可能的话，我想在打开弹出窗口之前执行此操作.

I could move the server-side check to the page that gets opened in the popup, but I'd like to do it before opening the popup, if possible.

代码:

<a id="attackButton" href="#">Attack Base!</a>

<script type="text/javascript">
$(function() {
    $('#attackButton').click(function() {
        $.ajax({
            url: baseurl + '/index.php?option=com_pbbgs&format=raw&getinfo=goingame',
            data: { 'gameid': 618 },
            dataType: 'text',
            async: false,
            type: 'POST',
            success: function(data) {
                eval(data);

                if (window.gameURL) {
                    goingameRaw();
                }
            }
        });

        return false;
    });
});

function goingameRaw()
{
    window.open(window.gameURL,'test','left=20,top=20,width=1024,height=640,toolbar=0,resizable=0,location=0');
}
</script>

示例响应正文:

window.gameURL="http://mydomain.com/index.php?option=com_pbbgs&format=raw&startgame=618&width=1024&height=640";checktutorial('js','attack');

推荐答案

是的，弹出窗口应该是用户操作的直接结果.在 ajax 回调中执行它们不会成功.此外，使用 async:false 是不好的 - 在 FF 中已知会阻止整个浏览器.想一些其他的方法来做检查:

Yes, popups should be a direct result of a user action. Doing them in ajax callback will not do the trick. Also, using async:false is bad - in FF it is known to block the whole browser. Think of some other way to do the check:

  • 这可能是您在弹出窗口中做的第一件事
  • 您可以在点击时打开弹出窗口，并在稍后触发回调时对其进行操作
  • 您可以要求用户再次单击某个按钮来触发弹出窗口(可能是最糟糕的解决方案)
  • 您可以在页面加载时执行此操作

相关文章