Découper avec HTML5 un fichier texte
Il peut arriver de se retrouver avec un fichier (Fig 1) trop gros, que l’on souhaite découper en fichiers plus petits. Par exemple, un fichier de données que l’on souhaite uploader dans SAP, mais qui est trop gros dans son état actuel.
Afin de pouvoir envoyer les données en plusieurs fois, je vous propose un outil en HTML5 (Fig 2)[1], avec exécution locale (sur votre ordinateur) uniquement, qui découpera pour vous votre fichier texte.
Munissez-vous de votre fichier texte (Fig 1), spécifiez le nombre de lignes d’en-tête à découper au début du fichier et à répéter sur chaque partie – ou spécifiez 0 si votre fichier ne possède pas de lignes d’en-tête – ainsi que le nombre de lignes à obtenir dans chaque partie.
Choisissez ensuite la manière la plus pratique pour vous d’envoyer le fichier, en le sélectionnant sur votre ordinateur, ou bien en effectuant un glisser-déplacer dans la zone prévue à cette effet.
Le traitement du fichier peut se révéler long suivant la taille de votre fichier source et la puissance de votre ordinateur.
Vous pourrez ensuite récupérer dans la partie inférieure de la page de résultats (Fig 3) les différentes parties du fichier découpé. Cliquez droit sur chaque partie et sélectionnez « Enregistrer la cible du lien sous… ».
Attention, l’application[1] étant réalisée en HTML5, elle peut ne pas fonctionner si vous utilisez un navigateur ancien (Fig 4) ne prenant pas en compte les normes actuelles du web. N’hésitez pas à vous procurer Mozilla Firefox[2] ou Google Chrome[3] par exemple.
Techniquement, les fichiers sont lus en local[4], en utilisant l’API File[5], puis traités grâce à FileSystem[6]. Un lien de téléchargement[7] est proposé. Les fichiers sont générés localement entre temps[8], les liens de téléchargement étant proposés avec des modifications DOM[9]. L’interface est un simple formulaire mis en forme avec CSS3[10].
Hyperlien
Liens et crédits
- [1] – Découpeur de fichier texte en HTML5 – Yoann Bierling, Consultant International – textfilesplit
- [2] – Télécharger et installer le navigateur web Mozilla Firefox – http://getfirefox.com
- [3] – Télécharger et installer le navigateur web Google Chrome – http://www.google.com/chrome
- [4] – Reading local files in Javascript – HTML5 Rocks – http://www.html5rocks.com
- [6] – Exploring the FileSystem APIs – HTML5 Rocks – http://www.html5rocks.com
- [7] – Downloading resources in HTML5: a[download] – HTML5Rocks Updates – http://updates.html5rocks.com
- [8] – Using HTML5/Javascript to generate and save a file – Stack Overflow – http://stackoverflow.com
- [9] – FileReader – Document Object Mode (DOM) | MDN – https://developer.mozilla.org
- [10] – Clean and Stylish CSS3 Form | Gazpo.com – http://gazpo.com