Deux solutions au problème d'Ajax ouvrant une nouvelle fenêtre et étant intercepté par le navigateur

Lorsque j'effectuais un paiement récemment, j'ai constaté que la fenêtre de paiement était bloquée par le navigateur lorsque je l'ouvrais. Que s'est-il passé ? Permettez-moi de partager avec vous deux solutions au problème d'Ajax ouvrant une nouvelle fenêtre et étant intercepté par le navigateur. Jetons un coup d'œil

Récemment, lorsque j'effectuais un paiement, j'ai constaté que la fenêtre de paiement était. intercepté par le navigateur lors de son ouverture. Après une recherche sur Baidu, j'ai découvert que c'était le cas. Parce qu'Ajax est utilisé pour vérifier si le paiement peut être effectué avant d'ouvrir la fenêtre, l'utilisateur n'a pas déclenché activement l'ouverture de la fenêtre ixin. J'ai pensé que c'était dangereux, alors il l'a bloqué.

Solution 1

Ouvrez d'abord une nouvelle fenêtre vide, puis modifiez l'URL de la nouvelle fenêtre, le code spécifique est

var wd = window.open();
$.ajax({
  type: "POST",
  dataType: "json",
  url: URL,
  data: {orderNo:orderNo},
  success: function(data) {
    if(data.status=='success'){
      wd.location.href = 'http://www.baidu.com';
    }else{ 
      alert('订单不能支付！'); 
    }
  },error: function(data) {
    alert("正在加载请稍后！");
  }
});

Cette méthode d'implémentation présente un inconvénient, c'est-à-dire que, que l'ajax réussisse ou non, la ligne de code var wd = window.open(); sera exécuté, donc le succès et l'échec ouvriront une nouvelle fenêtre à moins qu'elle ne soit fermée après un échec, mais cette expérience utilisateur sera très mauvaise, j'ai donc utilisé la deuxième méthode pour l'implémenter.

Solution 2

Parce qu'ajax est asynchrone par défaut, il a des performances élevées et une bonne expérience utilisateur, mais cela entraîne également des problèmes de sécurité, pour faire croire au navigateur que l'ouverture d'une nouvelle fenêtre est sûre, tous les ajax avant l'ouverture d'une nouvelle fenêtre doivent être synchronisés. Le code spécifique est

$.ajax({
  type: "POST",
  dataType: "json",
  url: URL,
  async: false,//同步请求
  data: {orderNo:orderNo},
  success: function(data) {
     if(data.status=='success'){
       window.open("www.baidu.com");
     }else{
       alert('订单不能支付！');
     }
  },
  error: function(data) {
    alert("正在加载请稍后！");
  }
});

Ce qui précède est ce que j'ai compilé pour tout le monde. J'espère que cela sera utile à tout le monde à l'avenir.

Articles connexes :

Code de vérification Ajax pour l'implémentation en double

Ajax implémente la fonction de type phpcms (image et texte) Tutoriel )

Implémentation Ajax du chargement des pages et de la suppression du contenu

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!