30

I have a weird issue with making fetch requests to my API on Android (using React Apollo). In the dev build as well as the release build fetch does not work. As soon as I power up React Native Debugger and enable Enable Network Inspect the requests work.

I have no idea how to debug the requests as they are not shown in the debugger without Network Inspect enabled.

Any ideas how I could find the error or did anyone of you run into the same issue?

mxmtsk
  • 4,285
  • 6
  • 22
  • 47
  • 1
    I was having a problem with the SSL of my backend server. I was getting this issue `java.security.cert.CertPathValidatorException: Trust anchor for certification path not found ` However when i connect the app to the debugger somehow android skips this error. – Puzzero Oct 26 '18 at 19:05
  • 1
    Bro, I have the same problem. If I enable network inspect react-native-debugger my API headers are passing but if I disable the headers are not passing. Please let me know if you have found any solution – Karthik C Yadav Aug 03 '20 at 06:30
  • 1
    To add to @Puzzero s comment, when you connect the app to the chrome debugger, the chrome debugger will take over your API requests and the request are handled by the chrome. This is why you are not seeing the error when remote debugging is enabled. You can enable SSL pinning on your application code to get around this, or probably disable the sslverification (not recommended) – nithinpp Nov 29 '20 at 07:40
  • 1
    did you find some solution man? @mxmtsk – neman Mar 12 '21 at 13:19
  • did you use https api? I have similar issue also with ssl certificate, the issue is with missing intermediate ssl certificate installation, check it the ssl cert in here https://www.digicert.com/help/ – bagi2info.com Jan 02 '23 at 10:58

5 Answers5

0

Probably API issue. I had same issue time ago. React-native-debugger handle url redirects. When you use react-native-debugger there is some extra logic added to your http request. Verify request, http:// https://, headers, cookies, etc.

(Postman do same as react-native-debugger)

0

Try to put android:usesCleartextTraffic="true" in your android manifest file

https://stackoverflow.com/a/61280828/8613355

Dharman
  • 30,962
  • 25
  • 85
  • 135
0

As default in AndroidManifest.xml in debug directory of android folder for android target +28 level android:usesCleartextTraffic="true" was been put but for releasing mode of the app, if your android target version >= 28 and your target web service hasn't SSL you should to add android:usesCleartextTraffic="true" manually in to application of AndroidManifest.xml in ./android/app/src/main and problem will solve.

MHP
  • 577
  • 5
  • 9
0

Following thing can help:

  1. the CROS policy error from server. Contact your backend team.
  2. if you are using http url. You need to use usesCleartextTraffic = true at application level in manifest. But using usesCleartextTraffic = true considered as one of vulnerability.
  3. if you want to debug the axios request. You need to use axios interceptor https://axios-http.com/docs/interceptors
0

This is presumably because, when this question was asked, React Native did not support fetch, if I'm not mistaken - and when debugging at that time you had to beware of some oddities, such as the debugger having access to objects/methods which were not available in the actual React Native runtime.

When the debugger was connected, the code is executed in the debugger rather than on the actual device, creating this effect.

You can see here that fetch requires a polyfill in versions from 2018.

We had to deal with other frustrations in this vein, like the authentication for our app needing to be re-authenticated when first connecting the debugger.

Slbox
  • 10,957
  • 15
  • 54
  • 106