React Native fetch stalls without return or error

655 views Asked by At

I'm currently building a React Native Android app and I'm trying to do a simple fetch inside my Code.

const response = await fetch('http://localhost:8081/assets/src/...',{
    method: 'GET'
})

There is absolutely no output from this call. No Error, no Return. When logging the Metro Server, there is not even a request coming in. The code stalls completely. I tried it with an XMLHttpRequest but the result is almost identical. The only difference is that the server gets the request. onerror or onload are never called.

What I've tried so far:

  • android:usesCleartextTraffic="true" added to manifest xml
  • inlineRequires: true, in metro config
  • used XMLHttpRequest
  • <uses-permission android:name="android.permission.INTERNET" /> is set

I Really hope someone can help me!

My Current package.json:

{
  "name": "myapp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint ."
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.17.7",
    "@tensorflow/tfjs": "^3.18.0",
    "@tensorflow/tfjs-react-native": "^0.8.0",
    "async-storage": "^0.1.0",
    "aws-sdk": "^2.1170.0",
    "expo": "^45.0.0",
    "expo-asset": "^8.5.0",
    "expo-camera": "^12.2.0",
    "expo-constants": "~13.1.1",
    "expo-file-system": "^14.0.0",
    "expo-gl": "^11.3.0",
    "expo-gl-cpp": "^11.3.0",
    "expo-modules-core": "^0.9.2",
    "ffmpeg-kit-react-native": "^4.5.2",
    "geolib": "^3.3.3",
    "graphql": "^16.5.0",
    "graphql-ws": "^5.9.1",
    "react": "17.0.2",
    "react-native": "0.68.2",
    "react-native-base64": "^0.2.1",
    "react-native-battery": "^0.1.18",
    "react-native-device-info": "^10.0.0",
    "react-native-fs": "^2.20.0",
    "react-native-geolocation-service": "^5.3.0",
    "react-native-maps": "^1.0.0",
    "react-native-polyfill-globals": "^3.1.0",
    "react-native-vision-camera": "^2.13.5",
    "text-encoding": "^0.7.0"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@babel/eslint-parser": "^7.18.2",
    "@babel/plugin-proposal-class-properties": "^7.18.6",
    "@babel/runtime": "^7.12.5",
    "@react-native-community/eslint-config": "^2.0.0",
    "babel-jest": "^26.6.3",
    "eslint": "^7.32.0",
    "jest": "^26.6.3",
    "metro-react-native-babel-preset": "^0.67.0",
    "react-test-renderer": "17.0.2"
  },
  "jest": {
    "preset": "react-native"
  }
}
1

There are 1 answers

5
yesIamFaded On

If your response from Postman and from the Browser looks good then its probably the fact that you are using localhost wich the Emulator cant understand.

Try to use your IP Adress (the one from your PC where the Emulator runs).

So instead of: fetch('http://localhost:8081/assets/src...

use: fetch('http://localIPaddressFromYourPC:8081/assets/src