2010-07-14 6 views
0

Est-il possible de faire une progression du téléchargement en utilisant javascript seulement? (Peut-être avec quelques ajax à un code côté serveur)la progression du téléchargement en utilisant javascript seulement

Avoir une forme telle que

<form method="post" action="upload.html" enctype="multipart/form-data"> 
<p>Select file to upload: <input type="file" name="selected_file"></p> 
<p><input type="submit" value="Upload the file"></p> 
<div id="progress"></div> 
</form> 

Je veux afficher des choses comme la progression du téléchargement, la vitesse, la taille totale.

Je ne veux pas d'outils pour cela, je veux comprendre comment cela se fait sans flash, et à partir de zéro.

des questions similaires (aucun à partir de zéro):

+0

double possible de [la progression du téléchargement en utilisant PHP/AJAX pur?] (Http://stackoverflow.com/questions/653063/upload-progress-using-pure-php-ajax) –

+0

Juste une brève idée sur la façon dont il est fait et où je pourrais chercher des ressources serait suffisant. Je suis juste curieux à ce sujet. – BrunoLM

Répondre

1

Je vois maintenant ce que vous entendez par "à partir de zéro". Je ne connais aucun moyen de faire cela qui ne nécessite pas de violon côté serveur.

Si vous avez accès à PHP 5.2 et peut installer des modules supplémentaires, je pense que c'est le plus proche que vous obtiendrez au sujet d'un processus étape par étape:

What's new in PHP V5.2, Part 5: Tracking file upload progress

Il faut APC mais J'ai dit, il n'y a pas de solution "pure" PHP/Ajax autant que je sache.

This question contient un certain nombre de ressources supplémentaires intéressantes.

2

HTML5 est votre ami. En particulier, vous devez lire sur les spécifications API de fichier de HTML5 (w3.org/TR/FileAPI/). En bref, il est fait avec l'aide de l'interface FileReader. Googling pourrait suggérer une lecture comme celle-ci au matlus.com/2010/09/html5-file-upload-with-progress/. En outre, il y a des limites de l'API atm et vous pourriez vouloir en savoir plus sur ceux de hacks.mozilla.org/2010/06/html5-adoption-stories-box-net-and-html5-drag-and-drop/.

Questions connexes