Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Fetch Fails with "Network request failed" only on Android

See original GitHub issue

Summary

Hi Expo Team - On Android async Fetch request fails with an ambiguous “Network request failed” error only on Android. iOS works great. This happens both locally in Expo Go, and in a production apk build on a physical device. Oddly enough, this only happens for ONE endpoint. Currently, I call 4 endpoints using fetch, and 3 work on Android. I highly doubt this is an issue with my server, because the fetch call that fails never makes it to the server. Greatly appreciate any help!

Managed or bare workflow? If you have `ios/` or `android/` directories in your project, the answer is bare!

managed

What platform(s) does this occur on?

Android

SDK Version (managed workflow only)

SDK 44

Environment

expo-env-info 1.0.2 environment info: System: OS: macOS 12.2.1 Shell: 5.8 - /bin/zsh Binaries: Node: 14.17.0 - /usr/local/bin/node Yarn: 1.22.15 - ~/.npm-global/bin/yarn npm: 6.14.13 - /usr/local/bin/npm Managers: CocoaPods: 1.11.2 - /usr/local/bin/pod SDKs: iOS SDK: Platforms: DriverKit 21.2, iOS 15.2, macOS 12.1, tvOS 15.2, watchOS 8.3 IDEs: Xcode: 13.2.1/13C100 - /usr/bin/xcodebuild npmPackages: babel-preset-expo: 9.0.1 => 9.0.1 expo: ^44.0.0 => 44.0.4 react: ^17.0.1 => 17.0.2 react-native: ^0.64.3 => 0.64.3 react-navigation: ^4.4.0 => 4.4.4 npmGlobalPackages: eas-cli: 0.47.0 expo-cli: 5.2.0 Expo Workflow: managed

Reproducible demo

Fetch call that fails:

export const updateEmailAction = (newEmail) => {
  return dispatch => {
    dispatch(triggerUpdateEmail());
    return getAuthToken(newEmail).then(request => {
      fetch(UPDATE_EMAIL_ENDPOINT, request)
      .then(response => {
        if(response.status === 200){
          dispatch(updateEmailSuccess())
        }else throw Error(response.error);
        })
        .catch(e => {
          console.log("ERROR", e.message);
          dispatch(updateEmailError())
        });
    })
  };
}

where getAuthToken() is:

const getAuthToken = (newEmail) => {
  return firebase.auth().currentUser.getIdToken().then((idToken) =>{
    const request = {
      method: 'POST',
      headers:{
        'Authorization': `Bearer ${idToken}`
      },
      body: newEmail
    }
    return request;
  });
}

Note: getAuthToken works fine and is not the cause of the issue. The issue happens with fetch()

Fetch call that works:

export const deleteAccountAction = () => {
  return dispatch => {
    dispatch(triggerDeleteAccount());
    return getAuthToken().then(request => {
      fetch(DELETE_USER_ENDPOINT, request)
        .then(response => {
          dispatch(deleteAccountSuccess(response))
        })
        .catch(e => {
          console.log(e);
          dispatch(deleteAccountError())
        });
    })
  };
}

As you can see, these fetch calls are essentially configured the same. The main difference is the URL to which they point. As I previously mentioned, the server isn’t receiving the request for the failed fetch. Its not rejecting the request, the fetch just isn’t happening. So strange. Please help - I’ve been scouring the internet for days without any lead. The error “Network request failed” is far too ambiguous. Thank you!