[AJAX] Construction d'un preloader pendant l'exécution d'un php

**renaud26** · 22/11/2008, 10h22

Bonjour à tous,

Je ne sais pas si je suis dans la bonne section, vu que ma question porte sur la meilleure technique à adopter... J'ai crée un petit script d'envoi de newsletter et je voudrais afficher un message d'attente, une barre de progression...pendant que PHP fait le boulot et envoie les vagues de mails. Ceci au lieu de la page toute blanche. J'ai lu plein de tutos, essayé des scripts JS, DHTML, AJAX...mais rien ne m'a satisfait puisque en générale le message "envoi en cours, merci de patienter" s'affiche en même temps que le résultat du traitement....donc trop tard.

Quelqu'un a une idée et peut me dire vers quoi je pourrais creuser ?
Merci à lui.
Bonne journée.

**ryan** · 23/11/2008, 19h20

Yop!

Si tes adresses email sont dans une BDD, c'est assez facile.

Dans ta page, tu boucles sur le résultat de ton query qui comporte donc toutes tes adresses email. Pour chaque adresse, tu écris un formulaire avec des champs cachés qui contiennent l'adresse email et les autres paramètre (l'index du mail envoyé, le nombre total de mail, le titre et le body de l'email, par exemple). La target du formulaire est une iframe. Dans cette iframe,tu as le code pour envoyer ta news letter, et en connaissant le nombre total de mail et l'index du mail couramment envoyé, tu peux construire une image qui réflète le % de mail envoyés par rapport au total de mails à envoyer.

**renaud26** · 24/11/2008, 09h45

Merci de cette suggestion...que je vais tenter, même si ça reste un peu flou...j'ai notamment peur que cette petite manip allourdisse considérablement le script...

Bonne journée.

**marcha** · 24/11/2008, 10h45

Salut,

La technique que j'utilise est la suivante:

une page pour le traitement d'envoi global, tel que tu l'a déjà fait.
dans cette page tu met à jour un compteur dans la base de donnée
dans une table prévue pour ça, ce compteur indique le pourcentage
effectué par exemple.

dans une autre page php tu lis juste ce compteur.

enfin, dans ta page d'envoi, tu lance d'abord une requête ajax qui
démarre le processus d'envoi, puis tu lance des requêtes régulières
(1 ou 2 fois par seconde) vers la 2ème page pour connaitre la progression.

**renaud26** · 24/11/2008, 16h47

Merci également de ta suggestion.

enfin, dans ta page d'envoi, tu lance d'abord une requête ajax

Ca il va falloir que je me documente serieusement parce que je suis à 0.

Une piste de plus à creuser...

**RomainVALERI** · 24/11/2008, 21h02

Si jamais dans ton cas la progression exacte n'est pas nécessaire (les n% accomplis), il y a éventuellement une solution bien plus rudimentaire que les excellentes solutions déjà proposées, qui serait la suivante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
var xhr = getXhr(); // voir note ci-dessous*
xhr.open("GET",mesDonnees.xml?monParam=uneValeur,true);
xhr.onReadyState = function()
{
   if (xhr.readyState == 1)
   {
      // ici gestion de l'attente, exemple (minimaliste) :
      var zoneAffichable = document.getElementById('idElementChoisiPourAfficher');
      zoneAffichable.value = "Veuillez patienter...traitement en cours"
   }
   else if (xhr.readyState == 4 && xhr.status == 200)
   {
      // ici code de succès de ton traitement
      // et effacement du message d'attente
   }
}
xhr.send(null);

*J'ose espérer que tu t'es écrit/récupéré une petite méthode getXhr() qui crée un objet XMLHTTPRequest selon le navigateur, bien entendu

**ryan** · 25/11/2008, 02h41

Yop!

Envoyé par renaud26

Merci de cette suggestion...que je vais tenter, même si ça reste un peu flou...

Je vais essayer de préciser les choses...

Première page:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
<html>
<body>
<?php
 
// on suppose que tu as effectué la connexion à la BDD
$query = "SELECT email FROM mytable";
$rs = mysql_query($query);
 
// le nb total d'emails à envoyer
$total = mysql_num_rows($rs);
 
// on initialise un compteur
$count = 0;
 
while ($row = mysql_fetch_assoc($rs)) 
{
  $count = $count + 1;
  echo "<form name='myform' action='sendmail.php' method=post target='myframe'>";
  echo "<input type=hidden name='total' value='" . $total . "'>";  
  echo "<input type=hidden name='count' value='" . $count . "'>";
  echo "<input type=hidden name='email' value='" . $row["email"] . "'>";  
  echo "<input type=hidden name='titre' value='ceci est le titre du mail'>";  
  echo "<input type=hidden name='body' value='ceci est le body du mail'>";    
  echo "</form>"; 
  echo "<script>document.forms.myform.submit();</script>"; 
}
?>
<iframe name="myframe" height=100 width=400>
</iframe>
</body>
</html>

La page sendmail.php

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
<html>
<body>
<?php
 
 // progression de la tâche en mode texte
 
 echo "Sending email " . $_POST["count"]  . " on " . $_POST["total"];
 
 // ensuite tu places le code qui expédie l'email....
 
 ...
 
?>
</body>
</html>

Pas testé, et comme il se fait tard, il se peut qu'il y ait des erreurs grossières, mais le principe est là.

**renaud26** · 25/11/2008, 09h01

J'ose espérer que tu t'es écrit/récupéré une petite méthode getXhr() qui crée un objet XMLHTTPRequest selon le navigateur, bien entendu

Euh....à vrai dire...non.

Mais je vais plonger dans les tutos AJAX...promis !

A Ryan : oui, merci, ça me paraît tout à fait clair, maintenant. Je vais tester ce système immédiatement.

Bonne journée à tous...et courage à ceux qui sont sous la neige...

**RomainVALERI** · 25/11/2008, 10h44

Envoyé par renaud26

Euh....à vrai dire...non.

Exemple très classique :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
function getXhr()
{
   if(window.XMLHttpRequest) // Firefox et autres
      var getXmlHttpRequest = new XMLHttpRequest();
   else if(window.ActiveXObject)
   { // Internet Explorer
      try
      {
         getXmlHttpRequest = new ActiveXObject("Msxml2.XMLHTTP");
      }
      catch(e)
      {
         getXmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
      }
   }
   else
   { // XMLHttpRequest non supporté par le navigateur
      alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
      getXmlHttpRequest = false;
   }
   return getXmlHttpRequest;
}

Envoyé par renaud26

...et courage à ceux qui sont sous la neige...

Merci bien du fin fond de la Lorraine

[AJAX] Construction d'un preloader pendant l'exécution d'un php

JavaScript

Vue hybride

Discussions similaires

Partager

Partager