Bonjour je charge une bonne quantité d'informations extraite d'une BDD MySQL via AJAX. Une fois récupérer et si il n'y a pas eu d'erreur j'insère les données récupérées dans un objet JS, bref...

Je souhaite depuis peu afficher la progression du téléchargement des données grâce a ce script JS

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
xhr.addEventListener( "progress", function ( evt ) {
	if (evt.lengthComputable) {
		var percentComplete = Math.round( evt.loaded * 100 / evt.total );
		$( '#progress' ).css( 'width', percentComplete + '%' )
		console.log(percentComplete, evt);
	}
}, false);
Il fonctionne très bien si je rajoute ceci dans mon fichier PHP

Code php : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
ob_start();
// Mon code PHP
$length = ob_get_length( );
header( 'Content-Length: '.$length."\r\n");
header( 'Accept-Ranges: bytes'."\r\n" );
ob_end_flush();

Mon problème est que le serveur exécute les instructions ( ce qui prend 90% du temps d'attente ) puis il renvoi les informations nécessaires pour que le code JS calcul la progression.

De plus ce dernier traitement JS va tellement vite que ma barre de progression va de 0 à ~30% puis disparaît ( je la cache lorsque le traitement est terminé )

Auriez vous une astuce ?

D'avance merci