Comment puis-je détecter si un navigateur bloque une popup ?

Question

Il m'est arrivé de tomber sur une page Web qui tente d'ouvrir une nouvelle fenêtre (pour permettre à l'utilisateur de saisir des données ou pour quelque chose d'important), mais le bloqueur de fenêtres pop-up l'en empêche.

Quelles méthodes la fenêtre appelante peut-elle utiliser pour s'assurer que la nouvelle fenêtre se lance correctement ?

Answer 1

Si vous utilisez JavaScript pour ouvrir la fenêtre contextuelle, vous pouvez utiliser quelque chose comme ceci :

var newWin = window.open(url);             

if(!newWin || newWin.closed || typeof newWin.closed=='undefined') 
{ 
    //POPUP BLOCKED
}

Answer 2

J'ai essayé un certain nombre des exemples ci-dessus, mais je n'ai pas réussi à les faire fonctionner avec Chrome. Cette approche simple semble fonctionner avec Chrome 39, Firefox 34, Safari 5.1.7 et IE 11. Voici l'extrait de code de notre bibliothèque JS.

openPopUp: function(urlToOpen) {
    var popup_window=window.open(urlToOpen,"myWindow","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, copyhistory=yes, width=400, height=400");            
    try {
        popup_window.focus();   
    } catch (e) {
        alert("Pop-up Blocker is enabled! Please add this site to your exception list.");
    }
}

Answer 3

Mise à jour : Les fenêtres pop-up existent depuis des temps très anciens. L'idée initiale était de montrer un autre contenu sans fermer la fenêtre principale. A partir de maintenant, il existe d'autres moyens de le faire : JavaScript est capable d'envoyer des requêtes au serveur, donc les popups sont rarement utilisées. Mais parfois, elles sont toujours pratiques.

Dans le passé, les sites malveillants abusaient beaucoup des popups. Une mauvaise page pouvait ouvrir des tonnes de fenêtres pop-up avec des publicités. Aujourd'hui, la plupart des navigateurs essaient de bloquer les popups et de protéger l'utilisateur.

La plupart des navigateurs bloquent les fenêtres pop-up si elles sont appelées en dehors des gestionnaires d'événements déclenchés par l'utilisateur, comme onclick.

Si vous y réfléchissez, c'est un peu délicat. Si le code se trouve directement dans un gestionnaire onclick, alors c'est facile. Mais que se passe-t-il si la popup s'ouvre dans setTimeout ?

Essayez ce code :

 // open after 3 seconds
setTimeout(() => window.open('http://google.com'), 3000);

La fenêtre contextuelle s'ouvre dans Chrome, mais est bloquée dans Firefox.

Et cela fonctionne aussi dans Firefox :

 // open after 1 seconds
setTimeout(() => window.open('http://google.com'), 1000);

La différence est que Firefox considère qu'un délai de 2000 ms ou moins est acceptable, mais qu'après cela, il supprime la "confiance", en supposant qu'il est maintenant "en dehors de l'action de l'utilisateur". Ainsi, le premier est bloqué, et le second ne l'est pas.

---

Réponse originale qui était actuelle 2012 :

Cette solution pour la vérification des bloqueurs de fenêtres pop-up a été testée dans FF (v11), Safari (v6), Chrome (v23.0.127.95) et IE (v7 & v9). Mettez à jour l'option displayError pour gérer le message d'erreur comme vous le souhaitez.

var popupBlockerChecker = {
    check: function(popup_window){
        var scope = this;
        if (popup_window) {
            if(/chrome/.test(navigator.userAgent.toLowerCase())){
                setTimeout(function () {
                    scope.is_popup_blocked(scope, popup_window);
                },200);
            }else{
                popup_window.onload = function () {
                    scope.is_popup_blocked(scope, popup_window);
                };
            }
        } else {
            scope.displayError();
        }
    },
    is_popup_blocked: function(scope, popup_window){
        if ((popup_window.innerHeight > 0)==false){ 
            scope.displayError();
        }
    },
    displayError: function(){
       alert("Popup Blocker is enabled! Please add this site to your exception list.");
    }
};

Utilisation :

var popup = window.open("http://www.google.ca", '_blank');
popupBlockerChecker.check(popup);

J'espère que cela vous aidera ! :)

Answer 4

Une "solution" qui va toujours La solution la plus simple, quelle que soit la version ou la marque du navigateur, consiste à afficher un message d'avertissement à l'écran, à proximité de la commande qui créera la fenêtre contextuelle, pour avertir poliment l'utilisateur que l'action nécessite une fenêtre contextuelle et qu'il doit l'activer pour le site.

Je sais qu'il n'y a rien d'extraordinaire, mais il n'y a rien de plus simple et il suffit d'environ 5 minutes pour le tester, puis vous pouvez passer à d'autres cauchemars.

Une fois que l'utilisateur a autorisé les fenêtres pop-up sur votre site, il serait également judicieux de ne pas en abuser. La dernière chose que vous voulez faire est d'ennuyer vos visiteurs.

Answer 5

J'ai combiné les solutions de @Kevin B et @DanielB.
C'est beaucoup plus simple.

var isPopupBlockerActivated = function(popupWindow) {
    if (popupWindow) {
        if (/chrome/.test(navigator.userAgent.toLowerCase())) {
            try {
                popupWindow.focus();
            } catch (e) {
                return true;
            }
        } else {
            popupWindow.onload = function() {
                return (popupWindow.innerHeight > 0) === false;
            };
        }
    } else {
        return true;
    }
    return false;
};

Uso:

var popup = window.open('https://www.google.com', '_blank');
if (isPopupBlockerActivated(popup)) {
    // Do what you want.
}