Popup bloqué, jquery window.open en succès: AJAX? à l'extérieur ok

Question

Quelqu'un peut-il aider, j'ai quelques jquery et le chrome bloque le popup que je crée. Après quelques recherches, il semble être un problème avec window.open en cas de succès d'un appel ajax. Y a-t-il un moyen de contourner cela? Mon appel jquery ajax doit renvoyer l'URL que j'ai besoin d'ouvrir et je suis donc coincé.

Si je place le open.window en dehors de l'appel ajax que cela fonctionne, mais à l'intérieur (succès) il est bloqué. Je pense qu'il est quelque chose à voir avec le contexte, mais je ne suis pas sûr ...

Toutes les idées ont vraiment apprécié ...

Voici ce que j'ai:

 window.open("https://www.myurl.com"); // OUTSIDE OF AJAX - no problems 
              // with popup 

    $.ajax({ 
     type: "POST", 
     url: "MyService.aspx/ConstructUrl", 
     data: jsonData, 
     contentType: "application/json; charset=utf-8", 
     dataType: "json", 
     success: function(msg) { 
      // Normally loads msg.d that is the url that is returned from service but put static url in for testing 
      window.open("https://www.myurl.com"); // THIS IS BLOCKED 
     }, 
     error: function(msg) { 
      //alert(error); 
     } 
    }); 

Answer 1

il suffit d'ouvrir la nouvelle fenêtre le rappel de succès:

$.ajax({ 
    type: "POST", 
    url: "MyService.aspx/ConstructUrl", 
    data: jsonData, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     window.open("https://www.myurl.com"); 
    }, 
    error: function(msg) { 
     //alert(error); 
    } 
}); 

Notez que vous pourriez avoir à régler l'option async de .ajax $ false pour cela, sinon le code suivant pourrait être évaluée avant que la réponse est reçu l'appel .ajax $.

Answer 2

Firefox effectue un blocage des fenêtres contextuelles en fonction de l'événement qui provoque l'exécution du code javascript; par exemple, il va permettre l'ouverture d'une fenêtre qui a été déclenchée à partir d'un onclick, mais pas celle qui a été déclenchée par un setTimeout. Cela a été un peu compliqué au fil des ans, car les annonceurs ont essayé de contourner le bloqueur de popup de Firefox.

Answer 3

Vous pouvez toujours avoir le code dans l'événement de réussite, mais async devra être faux.

Answer 4

Votre code renvoie ceux-ci dans Firefox et Chrome:

Firefox: "Firefox a empêché ce site d'ouvrir une fenêtre pop-up." Chrome: "Pop-up bloqué"

Pour résoudre ce problème, ajoutez simplement async: false à votre appel ajax.

$.ajax({ 
type: "POST", 
async: false, 
url: "MyService.aspx/ConstructUrl", 
data: jsonData, 
contentType: "application/json; charset=utf-8", 
dataType: "json", 
success: function(url) { 
    window.open(url); 
}, 
error: function(msg) { 
    //alert(error); 
} 

}); Faites attention à ce que async: false force le javascript à attendre le résultat ajax de jQuery. Cela signifie qu'il fige javascript jusqu'à ce que l'appel ajax est terminé.

Answer 5

Comme plusieurs personnes l'ont souligné, la réponse acceptée ne fonctionne plus. Basé sur le commentaire par aidiakapi, j'ai utilisé une solution de contournement en ouvrant d'abord la fenêtre.

window.open("about:blank", "myNewPage"); 

faire ensuite l'entreprise ajax et dans la fonction done(), ouvrez la page avec ce nom.

window.open("/foo.html", "myNewPage"); 

Cela n'a pas non plus d'importance si vous le faites asynchrone ou non.

Answer 6

Suivez la méthode décrite dans cet article:

window.open without popup blocker using AJAX and manipulating the window.location

En bref, l'approche est:

1. Votre code doit être initié par un événement onclick.
2. Ouvrez une nouvelle fenêtre, peut-être initialement sans contenu, avec window.open --- et stockez une référence à la fenêtre afin de pouvoir l'utiliser plus tard.
3. Dans le rappel de succès de votre opération AJAX, utilisez window.location.replace pour manipuler l'URL de votre fenêtre déjà ouverte avec l'URL souhaitée.

Answer 7

si vous mettez async: vrai, alors vous devez faire ce qui suit:

var safariOp = window.open("https://www.myurl.com"); //define before callback ajax contains url . 
$.ajax({ 
    type: "POST", 
    url: "MyService.aspx/ConstructUrl", 
    data: jsonData, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     //it's ok on safari 
     safariOp.focus(); 
    }, 
    error: function(msg) { 
     //alert(error); 
    } 
}); 

Answer 8

if you put async:true then you must do the following: 

var safariOP = window.open("https://www.myurl.com"); // DEFINE BEFORE AJAX CALLBACK 

$.ajax({ 
    type: "POST", 
    url: "MyService.aspx/ConstructUrl", 
    data: jsonData, 
    contentType: "application/json; charset=utf-8", 
    dataType: "json", 
    success: function(msg) { 
     if(safariOP){ 
     safariOP.focus(); // IT'S OK ON SAFARI 
     } 
    }, 
    error: function(msg) { 
     //alert(error); 
    } 
});