android emulator - React-Native doesn't connect with my API - "Error: Network Error"

Question

I have an error that I don't know how to get rid off. I'm trying to making an get in my backend API with express, but the only thing that I get is Error: Network Error from the android emulator, I'm using Android Studio.

It's a really simple project since I recently started at code with react-native.

In my API, basically have express, cors, an is running on port 3333.

My react-native project:

api.js

import axios from 'axios';

const api = axios.create({
  baseURL: 'http://localhost:3333/'
})

export default api;

index.js

import React, { useEffect, useState } from 'react';
import { View, Text, StyleSheet, StatusBar } from 'react-native';

import api from './services/api';

export default function App() {
  const [projects, setProjects] = useState([]);

  useEffect(() => {  
    api.get('projects').then(response => {
      console.log(response.data);
      setProjects(response.data);
    })

  }, [])

  return (
    <>
    <StatusBar barStyle='light-content' backgroundColor='#7159c1'/>
    <View style={styles.container}>
      <Text style={styles.title}>Hello World!</Text>
    </View>
    </>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#7159c1',
    justifyContent: 'center',
    alignItems: 'center',
  },

  title: {
    color: '#fff',
    fontSize: 32,
    fontWeight: 'bold',
  }
})

I just want to return in the console what I have inside the route localhost:3333/projects. I already tried use the address 10.0.2.2, my ipv4, to use localhost I tried the command adb reverse tcp:3333 tcp:3333 , desativate the firewall and I don't know what to do anymore.

The full error:

WARN     Possible Unhandled Promise Rejection (id: 0):
Error: Network Error
createError@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:99894:26
handleError@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:99798:27
dispatchEvent@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:32277:31
setReadyState@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:31367:33
__didCompleteResponse@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:31183:29
emit@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:3537:42
__callFunction@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:2765:36
http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:2497:31
__guard@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:2719:15
callFunctionReturnFlushedQueue@http://10.0.2.2:8081/index.bundle?platform=android&dev=true&minify=false:2496:21
callFunctionReturnFlushedQueue@[native code]

I have windows 10.

Edit 1: My friend runned my code in his macbook and worked fine. So could be some permission that is blocking mine backend at W10?

question from:https://stackoverflow.com/questions/65713274/react-native-doesnt-connect-with-my-api-error-network-error

Answer 1

Waitting for answers