React Native : problème de réponse non défini rencontré lors de l'accès à l'API Symfony localhost

Question

J'ai une application créée à l'aide de React Native qui s'exécute sur mon ordinateur local et je souhaite obtenir et afficher les données de mon API Symfony locale en cours d'exécution.

Le code React Native provient de l'adresse IP de mon PC local et des ports/routes Symfony :

constructor(props) {
  super(props);
  this.state = {
    isLoading: true,
    dataSource: [],
  }
}

componentDidMount() {
  return fetch('http://10.161.170.86:8000/api/hardwarePlacement')
  .then((response) => {
    console.log(response.ok);
  })
  .then((response) => response.json())
  .then((responseJson) => {
    console.log(response.ok);
    this.setState({
      isLoading: false,
      dataSource: responseJson.hardwarePlacements,
    })
  })
  .catch((error) => {
    console.log(error)
  });
}

Les données JSON que je reçois de mon API Symfony sont les suivantes, lorsque je les reçois via Postman ou directement via le navigateur :

[{"id":1,"name":"Bryggers","createdDate":{"date":"2023-02-08 15:14:12.000000","timezone_type":3,"timezone":"Europe\/Berlin"},"editedDate":{"date":"2023-02-14 13:57:07.000000","timezone_type":3,"timezone":"Europe\/Berlin"}},{"id":2,"name":"Stue","createdDate":{"date":"2023-02-08 21:52:46.000000","timezone_type":3,"timezone":"Europe\/Berlin"},"editedDate":{"date":"2023-02-08 21:52:46.000000","timezone_type":3,"timezone":"Europe\/Berlin"}},{"id":3,"name":"Stue","createdDate":{"date":"2023-02-14 13:57:10.000000","timezone_type":3,"timezone":"Europe\/Berlin"},"editedDate":{"date":"2023-02-14 13:57:10.000000","timezone_type":3,"timezone":"Europe\/Berlin"}}]

L'erreur que j'obtiens dans le terminal est :

[TypeError: undefined is not an object (evaluating 'response.json')]

Si j'essaie d'obtenir des données à partir d'une URL publique, cela fonctionne bien, mais cela échoue uniquement lors de l'obtention de données à partir d'une URL localhost.

Answer 1

Retour du premier then

.then((response) => {
    console.log(response.ok);
    return response
  })  
  .then((response) => response.json())