1
resposta

[Bug] Axios Network Error

Eu criei uma API no SpringBoot e tô tentando consumi-la no react native. O problema é que tá dando network error. Já testei no swagger, no postman e no React js, em todos funcionam, só no native que ta dando esse problema. Segue o código do app e o log do erro:

import { StyleSheet, Text, View } from 'react-native';
import Login from './components/Login';

export default function App() {
  return (
    <View style={styles.container}>
      <Login/>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});
import React, { useState} from 'react'
import axios from 'axios';
import { View, Text, Button, TextInput} from 'react-native'

const baseUrl = 'http://localhost:8080';

export default function Login(){
    
    const [login, setLogin] = useState('')
    const [senha, setSenha] = useState('')
    const [token, setToken] = useState('')

    const handleLogin = () =>{
        axios.post(baseUrl+'/login',{
            login: login,
            senha: senha
        })
        .then(function(response){
            setToken(response.data.token)
            console.log(response);
        })
        .catch(function(error){
            console.log(JSON.stringify(error))
        })      
        
    }

    return(
        <View>
        <Text>Login</Text>
        <TextInput placeholder='Login' value={login} onChangeText={setLogin}></TextInput>
        <TextInput placeholder='Senha' value={senha} onChangeText={setSenha}></TextInput>
        <Button title='Entrar' onPress={handleLogin}/>
        </View>
    )
}
 LOG  [AxiosError: Network Error]
 LOG  {"message":"Network Error","name":"AxiosError","stack":"AxiosError: Network Error\n    at handleError (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:133423:39)\n    at call (native)\n    at dispatchEvent (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:42667:31)\n    at setReadyState (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:40490:33)\n    at __didCompleteResponse (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:40276:29)\n    at apply (native)\n    at anonymous (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:40418:52)\n    at apply (native)\n    at emit (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:3062:40)\n    at apply (native)\n    at __callFunction (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:3732:36)\n    at anonymous (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:3452:31)\n    at __guard (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:3669:15)\n    at callFunctionReturnFlushedQueue (http://192.168.1.101:8081/node_modules%5Cexpo%5CAppEntry.bundle//&platform=android&dev=true&hot=false&lazy=true:3451:21)","config":{"transitional":{"silentJSONParsing":true,"forcedJSONParsing":true,"clarifyTimeoutError":false},"adapter":["xhr","http"],"transformRequest":[null],"transformResponse":[null],"timeout":0,"xsrfCookieName":"XSRF-TOKEN","xsrfHeaderName":"X-XSRF-TOKEN","maxContentLength":-1,"maxBodyLength":-1,"env":{},"headers":{"Accept":"application/json, text/plain, */*","Content-Type":"application/json"},"method":"post","url":"http://localhost:8080//login","data":"{\"login\":\"Ju\",\"senha\":\"123\"}"},"code":"ERR_NETWORK","status":null}

O projeto todo ta no meu github: https://github.com/trcosta97/cadastro-fichas/

1 resposta

https://stackoverflow.com/questions/49370747/network-error-with-axios-and-react-native

Seu emulador não roda na mesma rede que seu computador, afinal é um emulador e simula um dispositivo à parte. Portanto seguindo as dicas no stackoverflow, tente utilizar http://10.0.2.2:8080 ao invés de localhost.