Incompréhensible Uncaught SyntaxError: JSON.parse: unexpected character

**rdtech** · 04/12/2021, 19h47

Bonjour,
je récupère un ensemble de données capteurs (GPS, T°, RH%, etc...) que je mets en forme dans un fichier mesures.json sur disque dur.
Extrait du fichier avec uniquement latitude et longitude:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

{"positions":[[{"latitude": 43.27216, "longitude": 5.42601}][{"latitude": 43.27282, "longitude": 5.42606}],[{"latitude": 43.27283, "longitude": 5.42667}]]}

Dans mon code je veux exploiter le contenu de ce fichier pour faire de l'affichage sur une page:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
function readFile(input) {
	let fileReader = new FileReader(); 
	fileReader.readAsText(file);
 
	fileReader.onload = function() {
		//JSON.parse() demande d'encadrer lecontenu du fichier
		let data = "'" + fileReader.result + "'";
		console.log(data);
		let myData = JSON.parse(data);
		console.log(myData.positions[0][0].latitude);
		console.log(myData.positions[0][0].longitude);
	}; 
}

Et j'ai donc systématiquement le message d'erreur:

Uncaught SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

Le console.log() donne un affichage correct.

Si j'exploite ces mêmes données mais dans une variable locale:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

let myData = '{"positions":[[{"latitude": 43.27216,"longitude": 5.42601}],[{"latitude": 43.27282, "longitude": 5.42606}],[{"latitude": 43.27283, "longitude": 5.42667}]]}';

Ca fonctionne parfaitement...
J'ai déjà consommé pas mal d'heures là-dessus, si quelqu'un a une idée?
Merci.
P.S.: je ne suis pas du tout expert en dev web.

**ProgElecT** · 04/12/2021, 21h17

Salut

{"positions":[[{"latitude": 43.27216, "longitude": 5.42601}][{"latitude": 43.27282, "longitude": 5.42606}],[{"latitude": 43.27283, "longitude": 5.42667}]]}. pas bon
{"positions":[[{"latitude": 43.27216, "longitude": 5.42601}],[{"latitude": 43.27282, "longitude": 5.42606}],[{"latitude": 43.27283, "longitude": 5.42667}]]} c'est mieux ainsi, il te manque une virgule à la 2éme déclaration
D'ailleurs dans l'exemple affectation à une avec variable, là la virgule y est bien.

Pour vérifier la validité d'un JSON: https://jsonlint.com/

**rdtech** · 05/12/2021, 09h28

Bonjour et merci pour ta réponse,
j'ai corrigé mais l'erreur persiste.

Uncaught SyntaxError: JSON.parse: unexpected character at line 1 column 1 of the JSON data

J'appelle ma fonction comme ça (repris depuis un site dédié au JS):

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
<body>
	<h3 color=red>Relevé de positions</h3>
	<input onchange="readFile(this)" type="file">
</body>

Est-là le pb?
Est-ce que mon fichier positions.json sur le disque comporte un bug ? --> WinHex ne décèle rien

**ProgElecT** · 05/12/2021, 10h08

Salut

Tu fais un console.log(data); ligne 8 dans la fonction function readFile(input), moi je ferais un copier que je collerais dans le vérificateur https://jsonlint.com/ pour voir ce que cela donne.
C'est ce que j'ai fait pour te signaler le problème de virgule.

**ProgElecT** · 05/12/2021, 10h56

Re

Essais d'ajouter [ en début, et ] en fin de fileReader.result avant de parser.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
		//JSON.parse() demande d'encadrer lecontenu du fichier
		let data = "[" + fileReader.result + "]";

**NoSmoking** · 05/12/2021, 13h47

Bonjour,
Attention

//JSON.parse() demande d'encadrer lecontenu du fichier

ton fileReader.result est une chaine donc inutile de l'encadrer.

Donc avec :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<h3 color=red>Relevé de positions</h3>
<input onchange="readFile(event)" type="file">

faire simplement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
function readFile(ev) {
  const files = ev.target.files;
  file = files[0];
  const fileReader = new FileReader();
  fileReader.onload = function() {
    const data = JSON.parse(this.result);
    // pour voir comment se présente l'objet
    console.log(data);
  };
  fileReader.readAsText(file);
}

**rdtech** · 06/12/2021, 13h20

Bonjour et merci pour vos réponses, ça fonctionne!
Effectivement l'erreur est d'encadrer fileReader.result() de guillemets simples.
La remarque de 10h08 de ProgElecT m'a mis sur la voie, le vérificateur n'était pas d'accord et je prend en compte la technique de NoSmoking. Ca m'a l'air écrit par un spécialiste (plus que moi...).

Merci.

**NoSmoking** · 06/12/2021, 16h58

... et je prend en compte la technique de NoSmoking.

ce n'est pas une technique mais une façon, parmi d'autres, d'écrire la fonction ni plus ni moins

Incompréhensible Uncaught SyntaxError: JSON.parse: unexpected character

JavaScript

Discussions similaires

Partager

Partager