web-dev-qa-db-fra.com

Erreur: SyntaxError: extrémité inattendue de l'entrée JSON à Fetch.then.Response

Je reçois cette erreur à chaque fois que j'essaie d'utiliser le POST Méthode dans mon API.

SyntaxError: Unexpected end of JSON input at fetch.then.response

Lorsque j'utilise la méthode d'obtention, je reçois les données normalement. Ceci est le code:

const teste = () => {
fetch("myURL/test", {
    method: "POST",
    headers: {
        "Content-Type": "application/json"
    },
    body: JSON.stringify({
        id: 1,
        name: "Teste",
        amount: 1,
        value: 3
    })
})
.then(response => response.json()) //Here is the error
.then(data => {
    console.log(data);
})
.catch((err)=>console.log(err))}

Est-ce que quelqu'un peut m'aider? Merci.

EDIT: J'ajoute simplement cette ligne pour voir le journal:

.then(response => console.log(response))

Voici ce que j'ai obtenu:

Response {
type: "cors",
url: "myURL/test",
redirected: false,
status: 201,
ok: true,
…}
body: (...)
bodyUsed: false
headers: Headers {}
ok: true
redirected: false
status: 201
statusText: ""
type: "cors"
: "myURL/test"
__proto__: Response
javascriptapipostfetch
5
Ricardo Sanches

Cela signifie que la page a été récupérée à myURL/test Ne répond pas avec le contenu JSON ou avec un contenu JSON malformé. Ce n'est pas une erreur dans votre script, qui va bien, c'est une erreur avec votre serveur, qui ne servant pas de contenu JSON à myURL/test.

Notez également que les serveurs pourraient ne pas réagir de la même manière pour obtenir des demandes et POST Demande de la même URL! Si vous récupérez Valide JSON à partir d'une demande d'obtention, mais, comme vous l'avez décrit, n'a pas réussi à récupérer JSON valide à partir de A POST Demande, votre serveur peut servir de contenu différent selon le type de demande. En savoir plus sur cela.

Conseils de débogage

  • Remplacez then(resp => resp.json()) par then(resp => resp.text()).then(console.log) Pour voir à quoi ressemble le contenu desservi
  • Utilisez Postman pour simuler les appels API et voir à quoi ressemble le contenu servi, avec plus de détails
  • Examinez la réponse avec les outils de développement:
    1. En chrome
    2. Ouvrez la console (F12)
    3. Aller à l'onglet network
    4. Cliquez sur le serveur de fichiers par myURL/test
    5. Cliquez sur response: ce sera le contenu du texte. Il devrait être correctement formaté JSON.
2
Nino Filiu

Fondamentalement, obtenir la méthode n'envoie pas votre objet corporel au serveur dans lequel vous obtenez la réponse. Seuls le POST Action enverra votre objet corporel au serveur.

Je suppose que l'objet que vous souhaitez envoyer est le problème. Soit le serveur que vous essayez de vous connecter ne prévoit pas l'objet corporel comme chaîne ou vous devez vous assurer que vous avez correctement analysé le JSON avant le traitement.

0
karthick-nr

On dirait que l'API que vous appelez, n'a pas d'organisme de réponse sur ce poste particulier. Ensuite, lorsque vous appelez response.json() (conversion response.body à JSON) il fonctionne en erreur. Ou peut-être que la réponse est le corps n'est pas un corps JSON valide.

Si vous voulez gérer cette erreur plus de mode de mode, vous pourriez aller comme ça:

tryGetJson = async (resp) => {
    return new Promise((resolve) => {
      if (resp) {
        resp.json().then(json => resolve(json)).catch(() => resolve(null))
      } else {
        resolve(null)
      }
    })
  }

https://github.com/github/fetch/issues/268#issuecomment-399497478

0
Pablo Castro