Graphql Network Error on release version of react-native android app

Viewed 821

I have developed a react-native android app that uses graphql and I can connect to the graphql server as well as perform mutations and queries but only on the debug version of the app. The problem arises when I build the release version of the app and run it on my phone. On performing the login mutation, I face
'networkError: ', '{"line":123,"column":7285,"sourceURL":"index.android.bundle"}'

Graphql initialization code,

const httpLink = createHttpLink({
  uri: 'https://<IP>:4050'
})

const authLink = setContext((_, { headers }) => {
  getMyValue(AUTH_TOKEN)
  return {
    headers: {
      ...headers,
      authorization: token ? `Bearer ${token}` : ''
  }
})

const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache()
})

This is the component that throws the error,

<Mutation
                mutation={gql`
                  mutation login($username:String!,$password:String!){
                    login(username:$username,password:$password)
                  }
                `}
                variables={{ username, password }}
                onError={(err) => {
                  console.log('err: ', err);
                }}
                onCompleted={data => {...}}
              >
                {mutation => (
                  <Button full style={styles.loginButton}
                    onPress={() => {
                        mutation()
                    }}>
                      <Text>Login</Text>
                  </Button>
                )}
              </Mutation>

On the debug version of the application, it goes to the onCompleted block of code which is what I want for the release version of the application also. Instead, on the release version of the app, it goes to the onError block of code and throws the network error.

1 Answers

Add this line in your android manifest Application tag

android:usesCleartextTraffic="true"
Related