Impossibile effettuare chiamate API utilizzando nativa react

Question

Ho una macchina virtuale in esecuzione localmente costruita utilizzando Vagrant. Sono in grado di arricciare e andare all'URL direttamente dal browser. Per qualche ragione, quando faccio la stessa chiamata nella mia app nativa per il test usando l'API fetch, continua a darmi l'errore Network request failed.

Ecco un frammento del codice:

fetchData() { 

    this.setState({ isLoading: true }); 

    var baseURL = 'https://192.168.33.33/api/session'; 

    console.log('URL: >>> ' + baseURL); 

    fetch(baseURL) 
    .then((response) => response.json()) 
    .then((responseData) => { 
    console.log(responseData); 
    }) 
    .catch(error => { 
    console.log(error); 
    }) 
    .done(); 
} 

Il registro baseURL ci restituisce il diritto URL e l'errore si presenta in questo modo:

URL: >>> http://192.168.33.33/api/session 
TypeError: Network request failed {stack: (...), message: "Network request failed"} 
    message: "Network request failed" 
    stack: (...) 
    get stack: function() { [native code] } 
    set stack: function() { [native code] } 
    __proto__: Error 

ho pensato che potrebbe essere stato un problema con la mia VM non essendo accessibile in qualche modo dalla mia app, quindi sono andato avanti e l'ho implementato su un server reale e ha comunque dato lo stesso errore.

Qualche idea?

Answer 1

Trovato il problema e risolto.

Il problema era causato dall'avere un certificato autofirmato nel server API senza una CA creata automaticamente.

Potrei provare a creare la mia CA e quindi creare un certificato da quello, ma sono andato avanti e ho ottenuto un certificato SSL economico molto economico. Questo ha risolto il problema.

Answer 2

Penso che potresti trovarti di fronte al vincolo same origin policy.

Ci sono many modi per aggirarlo.