Utiliser FileReader pour lire un fichier JSON ?

Question

J'essaie de lire un fichier JSON que j'ai, téléchargé par l'utilisateur, et de le copier dans un tableau. Cependant, avec un .readAsText(), le retour que j'obtiens a le formatage d'une chaîne de caractères (évidemment), tel que incluant \" et \n et d'autres propriétés semblables à celles des cordes.

Existe-t-il un moyen d'utiliser FileReader (ou toute autre forme de lecture de fichiers, qui n'implique pas de serveur) pour lire le fichier JSON et faire en sorte qu'il ne renvoie que le JSON brut ?

Par exemple, s'il retourne

[
  {"hello": "world"}
]

o

[{"hello": "world"}]

et non

"[\n{\"hello\": \"world\"}\n]"

?

Edit : Je connais maintenant la méthode JSON.parse(text), mais j'obtiens une erreur lors de l'analyse de l'objet FileReader.

 let fileUploaded = new FileReader();
 fileUploaded.readAsText(MY_JSON_FILE);
 console.log(JSON.parse(fileUploaded));

il renvoie l'erreur error TS2345: Argument of type 'FileReader' is not assignable to parameter of type 'string'

Puis-je transformer ce que je lis avec FileReader en une autre variable qui est une chaîne de caractères, puis analyser cette nouvelle variable ?

Answer 1

Le code de la question utilise FileReader incorrectement.

FileReader .readAs<Type> est asynchrone. FileReader tiene load y loadend des événements où le result propriété de event.target y FileReader est le résultat du traitement asynchrone des données.

Ne pas analyser les FileReader l'objet lui-même.

.readAs<Type> s'attend à ce qu'un Blob à passer comme paramètre, et non un objet JavaScript ordinaire.

const MY_JSON_FILE = [{
  "hello": "world"
}];

let json = JSON.stringify(MY_JSON_FILE);

const blob = new Blob([json], {type:"application/json"});

const fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result, JSON.parse(fr.result))
});

fr.readAsText(blob);