Comment récupérer le contenu d'un fichier en JavaScript ?

Réponses rédigées par Antoine

Dernière mise à jour : 2020-08-02 15:01:12

Question

J'ai un fichier qui est soumis via un formulaire, et dont je voudrais lire le contenu et le stocker dans une variable. Comment puis-je récupérer le contenu d'un fichier en JavaScript ?

Réponse

Pour parser et récupérer le contenu d'un fichier en JavaScript, vous pouvez utiliser les méthodes readAsText, readAsArrayBuffer, readAsBinaryString ou readAsDataURL.

Voic un exemple pour récupérer le contenu d'un fichier soumis via un formulaire du type <input type="file"> avec JavaScript et la méthode readAsText :

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Comment récupérer le contenu d'un fichier en JavaScript ?</title>
</head>
<body>
<input type="file" name="fichier" id="fichier"> 
<br> 
<pre id="resultat"></pre> 
<script type="text/javascript"> 
document.getElementById('fichier').addEventListener('change', function() 
{   
var fichier=new FileReader(); 
fichier.onload=function()
{ 
document.getElementById('resultat').textContent=fichier.result; 
}   
fichier.readAsText(this.files[0]); 
}) 
</script> 
</body>
</html>