Réaction JS Fetch renvoie une réponse vide mais Postman ne fonctionne pas

Question

J'ai une application React JS qui essaie de se connecter à une API basée sur des jetons (que je développe également, en utilisant Laravel 5.5 et Laravel Passport). J'essaie de mettre en œuvre le login de base (connexion en utilisant un nom d'utilisateur et mot de passe, recevoir un jeton du serveur une fois vérifié, utiliser ce jeton pour les requêtes futures).

Le code que je utilise fetch est ci-dessous:

function loginApi(username, password) { 
    return fetch(loginUrl, { 
     method: 'POST', 
     headers: { 
      'Content-Type': 'application/json', 
     }, 
     body: JSON.stringify({ 
      grant_type: 'password', 
      client_id: clientId, 
      client_secret: clientSecret, 
      username: username, 
      password: password 
     }) 

    }).then(handleApiErrors) 
    .then(response => response.json) 
} 

Il convient de noter qu'il est pas entièrement complète, comme je suis actuellement juste essayer de déterminer la réponse Je reviens.

J'ai déjà résolu les problèmes normaux que l'on rencontre, comme les problèmes CORS, mais le problème que je rencontre maintenant est que la réponse de l'API est juste ... vide. Même dans l'onglet Réseau des outils de développement de Chrome, si j'examine directement la demande, la réponse est vide.

Cependant, si je fais la même requête exacte avec Postman, les résultats sont exactement ce que je pense.

Quel pourrait être le problème ici? Pourquoi la même requête retournerait-elle des résultats différents?

Answer 1

.json est une fonction qui doit être appelée. Essayez ..

.then(response => response.json()) 

Vous renvoyez actuellement la fonction d'analyse .json.