Node.js implémente la barre de progression du fichier compatible IE789

Nodejs gère le téléchargement du fichier

Dans Express4, les fichiers de req n'ont undefined été définis; Le plus utilisé peut maintenant être formidable . Vous savez qu'il a un événement progress , donc vous êtes ravi. La barre de progrès de la version inférieure de IE est une chance; Ok, essayez-le:

 form .on ('error', function (err) {console.log (err);}) .on ('about', function () {console.log ('about');}) .on ('progress', fonction (bytesreceived, byTeseXPected) {var n = parseInt (parsefloat (bytesreceived / bytesexpected) .tofixed (2) * 100);

Oui, vous êtes heureux de voir que la console imprime une chaîne de valeurs de progression comme prévu; Ensuite, allez plus loin;

 form .on ('progress', fonction (bytesreceived, bytesexpected) {var n = paSeInt (parsefloat (bytesreceived / bytesexpected) .tofixed (2) * 100); res.write ('<cript> window.parent.call (' + n + ') </script>'); // upload without refresh, console.

La méthode call consiste à afficher la valeur de progression de la page; Malheureusement, vous ne pouvez voir que les derniers 100% et vous ne pouvez pas voir la valeur de progression détaillée spécifique téléchargée; Explorez à nouveau ...

Ensuite, modifions l'idée, essayons-la, enregistrez la valeur de progression de session et ajoutons une demande supplémentaire pour interroger la valeur de progression. Oh, ce n'est pas mal! Afin de garantir que la valeur de progression que vous demandez est la valeur de progression que vous téléchargez cette fois plutôt que la valeur de progression des autres téléchargements, vous devez convenir d'une valeur token dans la demande téléchargée et dans la demande supplémentaire; Maintenant, une autre question est de savoir comment obtenir ce token lors de la demande. Étant donné que le corps de demande du téléchargement de fichiers est dans Request Payload , req.body ne peut pas obtenir la valeur apportée par elle, et je ne veux pas analyser cette pile, bien sûr, je ne peux pas non plus l'analyser; Il est préférable de le mettre dans url , le problème est que parfois vous devez vous rafraîchir deux fois pour actualiser token , ce qui n'est pas bon! En dernier recours, je vais le mettre dans cookie !

 var cookies = function () {var cks = req.heders.cookie.split (';'), obj = {}; pour (var i = 0; i <cks.length; i ++) {obj [cks [i] .split ('=') [0] .replace (// s + / ig, '')] = unEscape (cks [i] .split ('=') [1]); } return obj; } (); var queryToken = cookies .__ token__; form .on ('progress', function (bytesreceived, bytesexpected) {var n = paSeInt (parsefloat (form.bytesreceived / form.bytesexpected) .tofixed (2) * 100); if (req.session ['fichier' + querytoken]) {req.Session ['fichier' + querythek req.Session ['fichier' + queryToken] = {token: queryToken, pourcentage: n}};

Pour IE789, je suis venu sonder pour la valeur des progrès. Pardonne-moi, mon cœur était en fait très douloureux;

 var getData = function () {$ .post ('/ uploader', {getFileInfo: 1, uploadToken: utils.cookie.getcookie ('__ token__')}) .then (function (data) {console.log); if (data.mes <0) {getData ();} else {var pros = data.info; appel (pros.percent); } getData ();

La méthode call consiste à afficher la valeur de progression de la page; Malheureusement, vous ne pouvez voir que les derniers 100% et vous ne pouvez pas voir la valeur de progression détaillée spécifique téléchargée; Explorez à nouveau ...

D'accord, je suis tombé dedans; Mais je pense toujours que quelque chose ne va pas, il n'y a aucun problème avec le sondage de l'Ajax. Le problème est que session doit attendre que le téléchargement soit terminé avant d'avoir une valeur, donc je ne peux voir que 100%, et je ne vois pas la valeur de progrès détaillée; Puis-je penser qu'en cours, la réédition res.write et cette req.session précédente ont été suspendues, mais cela permet d'économiser les résultats de chaque exécution jusqu'à la libération progress , donc je ne peux voir que 100%; Je ne suis pas d'humeur à lire le code source de formidable , bien sûr, je ne peux pas le comprendre, donc je pense que c'est d'abord!

Étant donné que le sondage ajax est bien, il n'est pas facile de le sauvegarder à session . Si cela ne fonctionne vraiment pas, essayez-le dans global . Il ne sera pas en mesure de fourrer une valeur dans l'objet global et il le suspendre. S'il fait un léger changement, il sera mis dans global :

 form .on ('progress', function (bytesreceived, bytesexpected) {var n = parseInt (parsefloat (form.bytesreceived / form.byteexpected) .tofixed (2) * 100); if ('File' + querytoken]) {global ['file' + querytoken] .percent Global ['file' + queryToken] = {token: queryToken, pourcentage: n}};

Continuer le sondage.

Beau, c'est tout! Ce que je vois dans Chrome est le même que la progression de HTML5, mais il semblera un peu coincé dans IE789, mais vous pouvez toujours voir la valeur de progrès détaillée; Après tout, les vieux navigateurs ne sont pas bons, vous savez; Et, chaque fois que vous téléchargez, vous mettez la valeur dans global , vous devez donc le nettoyer de manière appropriée. Une fois le fichier téléchargé, vous pouvez le transférer dans le répertoire spécifié global['file'+queryToken]=null ;

Cependant, le sondage signifie de nombreuses demandes les unes après les autres, et il peut y avoir des problèmes ici; Si vous ne le limitez pas, la valeur de progression est demandée une fois tous les 500 ms intervalles; Eh bien, la barre de progression de l'IE789 est résolue comme ceci, et il est convenu de jeter Flash; Bien que ce sondage soit compatible avec tous les navigateurs, il s'agit toujours d'un gaspillage de tant de demandes. Faisons un jugement, continuons HTML5 en dehors de IE789!

En fait, si vous le mesurez, lequel est le plus digne, plus un téléchargement de flash ou une demande supplémentaire? Pardonnez-moi de ne pas comprendre Flash, je ne dirai pas grand-chose. Quoi qu'il en soit, je n'aime pas ajouter des fichiers supplémentaires à la page;

Résumer

Il y a encore de nombreux détails sur les composants de téléchargement de fichiers. Je voulais à l'origine faire un fichier JS, mais plus tard, j'ai pensé que pour être plus réutilisable, il serait préférable de le faire en tant que page indépendante. Si vous avez besoin de le télécharger, il suffit de le faire, ce qui est certainement beaucoup mieux que de faire un fichier JS. Ce qui précède est l'intégralité du contenu de cet article. J'espère que cela peut vous aider à étudier ou à travailler. Si vous avez des questions, vous pouvez laisser un message pour communiquer.