IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

AJAX Discussion :

Affichage barre de progression


Sujet :

AJAX

  1. #1
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut Affichage barre de progression
    Bonjour à tous

    Voilà, j'ai un problème avec un script de barre de progression.

    J'explique un peu ce que j'essai de faire:

    J'ai fait un script en php pour télécharger des fichiers sur un FTP

    Je souhaite pendant le téléchargement une barre de progression, pour savoir ou en est le téléchargement

    le coté php est fait et opérationnelle, je récupère meme le % de la progressiondedant.

    J'ai tenté diverse méthodes mais sans succès

    Je me suis penché sur l'ajax mais pff je comprends pas grand chose (a cause de la fatigue je pense)

    je me suis fait une petite page de teste beta.php, que voici

    Code html : 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
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    <?php
     
    $action = @$_GET['a'];
     
    if($action == 'dl')
    {
        $file_size = 153600;
        echo "<ul>";
        for($i=0; $i<$file_size;$i++)
        {
            echo "<li>loaded=\"".(($i * 100) / $file_size)."\"</li>";
        }
        echo "</ul>";
     
    }
    else
    {
    ?><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Test</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    <meta http-equiv="Content-Language" content="fr" />
     
    <!--CSS-->
    <!--link rel="stylesheet" type="text/css" href="./css/portfolio_tk.css" />
    <!--Javascript-->
    <script src="scripts/jquery-3.2.1.js" type="text/javascript"></script>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="scripts/jquery-ui.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
     
    <script language='text/javascript'>
    var inputElement = $('#file');
     
    inputElement.change(function(){
        var files = inputElement.attr('files');
        var file = files[0];
        var xhr = new XMLHttpRequest();
     
        $('#barre').progressbar({ value: 0 }); // on initialise le plugin
     
        xhr.open('GET', 'beta.php?a=dl');
     
        xhr.onprogress = function(e){
        var loaded = Math.round(e.loaded); // on calcul le pourcentage de progression
        $('#barre').progressbar('value', loaded);
        }
        xhr.onload = function(){
        $('#barre').progressbar('value', 100);
        }
     
        var form = new FormData();
        form.append('file', inputElement.file);
     
        xhr.send(form);
    });
    </script>
    </head>
     
    <body>
    <table width="100%" border="0">
        <tr>
            <th>TITLE</th>
        </tr>
        <tr>
            <td>
                <div id="barre"></div>
            </td>
        </tr>
    </table>
    </body>
    </html><?php
    }
     
    ?>

    comme vous pouvez le voir, j'ai simulé un télechargement avec un
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    for($i=0; $i<$file_size;$i++) // $file_size = 150Mo
    ca me rempli ça au format HTML comme j'ai pu le voir sur le cours de ce site

    donc je renvois loaded="%deprogression"

    ensuite le code AJAX devrait aller chercher beta.php?a=dl pour prendre e.loaded

    j'ai bien déclaré jquery

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    <script src="scripts/jquery-3.2.1.js" type="text/javascript"></script>
    <script src="scripts/jquery-ui.js"></script>

    mais aucun résultat.

    Pouvez vous m'aider ?

    Merci d'avance

    Emmanuel

  2. #2
    Expert éminent sénior

    Homme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2010
    Messages
    5 380
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Puy de Dôme (Auvergne)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Septembre 2010
    Messages : 5 380
    Points : 10 410
    Points
    10 410
    Par défaut
    Salut,

    Je ne comprends pas trop comment ton code pourrait fonctionner...

    Tu peux trouver une solution d'upload ajax/php toute prête ici. Il suffit de dézipper le fichier et de placer le dossier sur ton serveur pour faire les premiers tests. Tu pourras faire afficher de nombreuses informations en temps réel dont la barre de progression, le temps restant, vignettes de prévisualisation des images (si le fichier est une image), le status du fichier, sa taille etc. et tout cela sans avoir à écrire une ligne de code javascript.
    Cet outil permet également de transférer des gros fichiers en surpassant les limites serveur php "upload_max_filesize", "post_max_size" et "max_file_uploads" de manière transparente. Supporte l'upload multiple, la personnalisation des boutons d'upload, le drag and drop, etc.

    Bref, tu peux gagner beaucoup de temps avec une solution éprouvée et évolutive qui propose en une quinzaine d'exemples entièrement fonctionnels dès l'installation du module d'upload sur ton serveur, ainsi qu'un mode d'emploi très détaillé en français.

  3. #3
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Salut et merci pour ta réponse

    Ce n est pas de la upload que j ai à faire mais du download

    Grossièrement mon serveur va sur un second serveur par FTP (pas de ssh possible).
    J ai la liste de mes fichiers je clique sur celui que je veux et ça me le te le charge
    Cela M éviterait de perdre du temps à faire la manipulation par un troisième poste en interface graphique (serveur vers pc puis pc vers serveur 2) ou de tout me taper en ligne de code directement sur le serveur en ssh

    Pour le te le chargement j utilisé la fonction ftp_nb_get qui me donne le statut MOREDATA
    Je fais un while ($get == MOREDATE) la dedans j enregistré une variable me donnant le filesize du fichier.

    Le if ($i.... que j ai mis tout à l'heure heure n est juste la que pour simuler le telechargement

  4. #4
    Expert éminent sénior
    Avatar de mathieu
    Profil pro
    Inscrit en
    Juin 2003
    Messages
    10 223
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2003
    Messages : 10 223
    Points : 15 516
    Points
    15 516
    Par défaut
    à quel élément correspond "#file" dans votre code JavaScript ?

  5. #5
    Membre régulier
    Homme Profil pro
    Fabricant de ressorts - programmeur amateur
    Inscrit en
    Janvier 2003
    Messages
    70
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Seine et Marne (Île de France)

    Informations professionnelles :
    Activité : Fabricant de ressorts - programmeur amateur
    Secteur : Industrie

    Informations forums :
    Inscription : Janvier 2003
    Messages : 70
    Points : 79
    Points
    79
    Par défaut
    Je vais essayer de résumer ce que tu veux faire.

    D'un coté sur le poste client, tu as une page internet comportant du code javascript qui va demander un appel à une routine php

    D'un autre coté sur le serveur, tu as une routine php qui effectue une tâche d'une certaine durée pour laquelle tu veux afficher sur la page client une barre de progression.

    Tu as bien compris que d'un coté, tu as le poste client et de l'autre le serveur.
    La seule manière d'y arriver, je pense, c'est que dans ta routine php, tu stockes au fur et à mesure l'avancement du travail (dans un fichier anexe ou une base de données ou dans une variable de session (à vérifier si ça marche)), et que par l'intermédiaire d'un autre appel php par ajax, une fois par seconde par exemple, qui va lire la valeur de l'avancement et au retour dans ton javascript afficher l'avancement dans ta barre de progression.
    mac pro bi-quad néhalem (2009) (16 proc et 8Go me MeV)
    Programmation : HTML - Javascript - PHP - AJAX - CSS : niveau amateur pour l'ensemble.

  6. #6
    Membre du Club
    Homme Profil pro
    Autre
    Inscrit en
    Août 2017
    Messages
    63
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France, Seine Maritime (Haute Normandie)

    Informations professionnelles :
    Activité : Autre

    Informations forums :
    Inscription : Août 2017
    Messages : 63
    Points : 45
    Points
    45
    Par défaut
    Oui en effet la solution que j ai mise en plece est cote serveur le script enregistre la progression en % et côté client l ajax vient chercher cette info pour la barre de progression.
    Fonctionnel maintenant
    Merci de votre aide les gars

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Barre de progression : problème affichage
    Par link256 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 4
    Dernier message: 21/07/2009, 13h23
  2. problème de barre de progression
    Par linalin dans le forum Débuter avec Java
    Réponses: 15
    Dernier message: 22/05/2008, 22h41
  3. [D2007] Problème de barre de progression sous Vista
    Par msprittc dans le forum Composants VCL
    Réponses: 2
    Dernier message: 13/12/2007, 14h31
  4. Problème avec une Barre de Progression
    Par hugo69 dans le forum Access
    Réponses: 1
    Dernier message: 15/12/2006, 16h37
  5. Réponses: 12
    Dernier message: 27/05/2004, 01h13

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo