Este es el error que me dice la consola, a la hora de intentar mostrar los JSON:
myFunction.js:17 SyntaxError: Unexpected token < in JSON at position 0.
No estoy usando ningun framework, ni ningun servidor, es todo desde html y JS vainilla.
A la linea que hace referencia es esta:
const res = await fetch('api.json')
Es la segunda vez que me ocurre este problema, a la hora de utilizar datos tipo JSON. He probado varias opciones de otras personas que les ha ocurrido y han publicado el error en StackOverflow, pero ninguna me funciona. Os comparto mi codigo para ver si alguien me puede ayudar.
Me salta error, en el fetch, a la hora de responder con Json.
Aqui está el codigo JS:
'use strcit'
const items = document.querySelector('#items');
const templateCard = document.querySelector('#template-card').content;
const fragment = document.createDocumentFragment();
document.addEventListener('DOMContentLoaded', () => {
fetchData();
});
const fetchData = async () => {
try{
const res = await fetch('api.json')
const data = await res.json();
console.log(data)
} catch (error) {
console.log(error)
}
};
const printCard = data => {
data.forEach(element => {
templateCard.querySelector('h3').textContent = element.name;
const clone = templateCard.cloneNode(true);
fragment.appendChild(clone)
})
items.appendChild(fragment);
};
Aqui dejo los JSON. Están en una carpeta llamada api.json que es la que hace referencia el:
const res = await fetch('api.json')
El código html no lo dejo, ya que creo que no es util, ya que el problema viene de otro lugar.
Añado los JSON:
[
{
"precio": 1,
"id": 1,
"name": "Desayuno",
"description": "Lorem"
},
{
"precio": 1,
"id": 2,
"name": "Ensalada Cesar",
"description": "Lorem"
}
]
console.log(res.text())
?