Afficher page de chargement durant l'execution d'un script

**Spydeus** · 19/08/2011, 10h58

Bonjour,

Voilà la situation :
Formulaire d'upload d'images.
Script php qui effectue des calculs sur l'image.
Affichage des résultats des calculs

Ce que je souhaiterais :
Quand la personne valide le formulaire, elle est redirigée vers une page "d'attente", comme lorsque l'on effectue une recherche de billet de train sur le site de www.voyages-sncf.com.
Lorsque le traitement est terminé (peut être instantané ou prendre plusieurs dizaines de secondes), l'utilisateur est directement redirigé vers la page de resultat des calculs.

La page d'attente devrait être du code HTML ou php pour que je puisse afficher diverses informations.

J'ai regardé du coté de l'upload de fichiers en Ajax, mais rien ne ressemble à ce que je voulais.J'ai trouvé un script qui affiche un message pendant le chargement d'une page, mais ce que je souhaite, c'est avoir une vraie page intermédiaire entre le formulaire d'upload et la page de résultats.

Par avance, merci pour votre aide

**Thes32** · 19/08/2011, 11h20

salut,

je pourrais résumer comme ceci :

- le script d'upload (script1.php) enverrai vers un script de confirmation d'upload + initialisation traitement (script2.php)

- via ajax script2.php déclecnherai le traitement sur l'image via un script3.php

- une fois le traitement complet script3.php stockerai les données (dans une bdd par exemple) et enverrai un identifiant via ajax à script2.php

- script2.php reçoit l'identifiant et dirige l'utilisateur avec javascript vers une page genre script4.php?id_info=ID

voilà

**FirePrawn** · 19/08/2011, 13h35

Bonjour,

Si tu veux une page de chargement, il te faut nécessairement cette page physiquement.
La technique de Thes correspond à ce que tu veux faire

**Spydeus** · 19/08/2011, 13h39

Merci pour votre réponse rapide et claire !

J'ai compris l'algo, maintenant il va falloir que je code tout ça, mais d'après ce que j'ai lu, l'ajax n'est pas trop compliqué.

**kdmbella** · 19/08/2011, 15h07

pour te lancer je te conseille ces 3 tutos tu seras servi :

http://gael-donat.developpez.com/web/intro-ajax/
http://siddh.developpez.com/articles/ajax/
http://dmouronval.developpez.com/tut...-requete-ajax/

sans oublier la faq
http://javascript.developpez.com/faq/

bon travail

**Spydeus** · 19/08/2011, 19h33

Ok, merci !

Heureusement que demain c'est le weekend !

**Spydeus** · 20/08/2011, 00h51

Bon, après pas mal de lecture et de test, je bute sur un problème. Dans ce tutoriel, je fais cette partie : http://gael-donat.developpez.com/web/intro-ajax/#LIII-B.

En fait, le div "Veuillez patienter ..." reste affiché et ne disparait que si je clique avec la souris.

J'ai ceci :
upload.php

Code :

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

1
2
3
4
5
6
7
8
<?php
header('Content-Type: text/xml'); 
 
// vérification du fichier etc
 
sleep(5); // pour tester car je suis en local alors c'est instantanné
 
?>

index.php :
contient le formulaire et renvoie vers le fichier script2.php lorsque l'on clique sur le bouton "envoyer" du formulaire.

script2.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
17
18
19
 
<?php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
	<title>Test</title>
	<link rel="stylesheet" href="style.css" type="text/css" />
 
        <script type="text/javascript" src="ajax.js"></script>
 
</head>
 
<body onload="ajax()">
 
<div class="tumevoispas" id="message">Veuillez patienter...</div>
 
</body>
?>
</html>

ajax.js

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
function ajax()
{
    var xhr=null;
 
    if (window.XMLHttpRequest) { 
        xhr = new XMLHttpRequest();
    }
    else if (window.ActiveXObject) 
    {
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    }
    //on définit l'appel de la fonction au retour serveur
    xhr.onreadystatechange = function() { alert_ajax(xhr); };
 
    //on affiche le message d'acceuil
    document.getElementById("message").className="tumevois";
 
    xhr.open("GET", "upload.php", true);
    xhr.send(null);
}
 
function alert_ajax(xhr)
{
    if (xhr.readyState==4) 
    {
    	document.getElementById("message").className="tumevoispas";
    }
}

En théorie, il doit se passer :
Appuie sur le bouton "envoyer", redirection vers script2.php, qui lance au chargement de la page la fonction ajax(). Cette fonction demande au serveur d'executer le fichier upload.php. Cela affiche alors un message d'attente qui disparait quand upload.php arrive à la fin du fichier.

Je sais que ce n'ai pas ce que je voulais faire au début, mais pour l'instant je me concentre simplement sur l'upload. Car si je n'arrive même pas à faire ça, je ne pourrai pas me débrouiller pour demander à mon script de calcul de renvoyer l'identifiant ID !

Merci

Afficher page de chargement durant l'execution d'un script

Langage PHP

Discussions similaires

Partager

Partager