expo: axios request not working after build apk

Summary

I have made project with expo, run it on emulator it is working fine. Axois request is also working fine. once almost thing are working, i thought to make a build apk file to test it on my andoid phone. Apk get installed by the axios request is not working it is not working as expected. I am already using https server for using api, but still apk is file is not working on my andoid mobile.

Managed or bare workflow?

managed

What platform(s) does this occur on?

Android

Package versions

6.3.8

Environment

expo-env-info 1.0.5 environment info: System: OS: Linux 5.19 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish) Shell: 5.1.16 - /bin/bash Binaries: Node: 18.13.0 - ~/.nvm/versions/node/v18.13.0/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v18.13.0/bin/yarn npm: 9.2.0 - ~/.nvm/versions/node/v18.13.0/bin/npm npmPackages: expo: ^48.0.11 => 48.0.11 react: 18.2.0 => 18.2.0 react-dom: 18.2.0 => 18.2.0 react-native: 0.71.8 => 0.71.8 react-navigation: ^4.4.4 => 4.4.4 npmGlobalPackages: eas-cli: 3.13.3 expo-cli: 6.3.8 Expo Workflow: managed

Reproducible demo

import React, { useState } from ‘react’ import { TouchableOpacity, StyleSheet, View } from ‘react-native’ import { Text } from ‘react-native-paper’ import Background from ‘…/components/Background’ import Logo from ‘…/components/Logo’ import Header from ‘…/components/Header’ import Button from ‘…/components/Button’ import TextInput from ‘…/components/TextInput’ import BackButton from ‘…/components/BackButton’ import { theme } from ‘…/core/theme’ import { emailValidator } from ‘…/helpers/emailValidator’ import { passwordValidator } from ‘…/helpers/passwordValidator’ import { mobileValidator } from ‘…/helpers/mobileValidator’

import { API_URL } from ‘@env’ import axios from ‘axios’ import * as Device from ‘expo-device’ import Toast from ‘react-native-toast-message’; import AsyncStorage from ‘@react-native-async-storage/async-storage’ import { loginSuccess } from ‘…/reducers/authReducer’; import { useDispatch } from ‘react-redux’;

export default function LoginScreen({ navigation }) { const [email, setEmail] = useState({ value: ‘’, error: ‘’ }) const [password, setPassword] = useState({ value: ‘’, error: ‘’ }) const dispatch = useDispatch();

const onLoginPressed = () => { const emailError = emailValidator(email.value) const mobileError = mobileValidator(email.value) if (emailError && mobileError) { setEmail({ …email, error: ‘Enter valid email or Mobile’ }) return }

const passwordError = passwordValidator(password.value)
if (passwordError) {
  setPassword({ ...password, error: passwordError })
  return
}

axios.post(`${API_URL}/login`, { "email": email.value, "password":password.value, "devicename": Device.modelName })
.then(response=>{
  // console.log('mith')
  // console.log(response.data)
  if(response.data.status){
    AsyncStorage.setItem('AccessToken', JSON.stringify(response.data.token));        
    Toast.show({
      type: 'success',
      text1: 'Logged in successfully',          
    });                
    dispatch(loginSuccess(response.data.user));        
  }else{
    setPassword({ ...password, error: "Invalid email or password" })        
  }
}).catch(error => console.log(error.message));

}

return ( <Background> <Logo /> <Header>Login</Header> <TextInput label=“Email/Mobile” returnKeyType=“next” value={email.value} onChangeText={(text) => setEmail({ value: text, error: ‘’ })} error={!!email.error} errorText={email.error} autoCapitalize=“none” style={styles.email} /> <TextInput label=“Password” returnKeyType=“done” value={password.value} onChangeText={(text) => setPassword({ value: text, error: ‘’ })} error={!!password.error} errorText={password.error} secureTextEntry /> <View style={styles.forgotPassword}> <TouchableOpacity onPress={() => navigation.navigate(‘Reset Password’)} > <Text style={styles.forgot}>Forgot your password?</Text> </TouchableOpacity> </View> <Button mode="contained" onPress={onLoginPressed}> Login </Button> <View style={styles.row}> <Text>Don’t have an account? </Text> <TouchableOpacity onPress={() => navigation.navigate(‘Register’)}> <Text style={styles.link}>Sign up</Text> </TouchableOpacity> </View> </Background> ) }

const styles = StyleSheet.create({ forgotPassword: { width: ‘100%’, alignItems: ‘flex-end’, marginBottom: 24, }, row: { flexDirection: ‘row’, marginTop: 4, }, forgot: { fontSize: 13, color: theme.colors.secondary, }, link: { fontWeight: ‘bold’, color: theme.colors.primary, }, email:{ //marginTop: 160 } })

eas.json

{ “cli”: { “version”: “>= 3.13.3” }, “build”: { “development”: { “developmentClient”: true, “distribution”: “internal” }, “preview”: { “android”: { “buildType”: “apk” }, “distribution”: “internal” }, “preview2”: { “android”: { “gradleCommand”: “:app:assembleRelease” } }, “production”: { “channel”: “production” } }, “submit”: { “production”: {} } }

Stacktrace (if a crash is involved)

No response

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 2
  • Comments: 35

Most upvoted comments

Just to keep records os my solution for any one else that may face similar issue:

I was also unable to perform HTTP calls in my APK version of the app. In development it worked fine, but in production I was receiving this vague “Network Error” for HTTP and HTTPS calls.

After a long time debuging and searching the internet , I decided to try @shabuj-alam’s suggestion and it was finnaly overcome. For non-ejected Expo projects, however, the approach is a bit different:

Expo team offers the plugin expo-build-properties, which allows us to pass the usesCleartextTraffic propoerty for building process. Therefore my app.json file stays like this:

// app.json

{
  "expo": {
    /* ...  (other settings)*/
    "plugins": [
      /* ...  (other plugins)*/
      [
        "expo-build-properties",
        {
          "android": {
            "usesCleartextTraffic": true
          }
        }
      ]
    ]
  }
}

My issue has been solved. I don’t need SSL certificate.

added these to my /android/app/src/main/AndroidManifest.xml

<manifest …> <application … android:usesCleartextTraffic=“true” // <-- added this …> …

this worked for me

My issue has been solved. I don’t need SSL certificate.

added these to my /android/app/src/main/AndroidManifest.xml

<manifest …> <uses-permission android:name="android.permission.INTERNET" /> <application … android:usesCleartextTraffic=“true” // <-- added this …> … </application> </manifest>

@juliolmuller You saved my life.

@devmotionfr I think so, at least in production/preview builds, because most things (maybe all) in the app.config is defined and unchanged for the build (in developmentClient builds, though, the environment variables, and maybe other settings, don’t need a rebuild).

thank you so much man

my mistake was quite silly, i was calling the api without having a ssl certificate, i fixed that and my app started working correctly. maybe this will help someone.

@funkenpedro:

  • did you install the proper plugin?
  • are you seeing error in dev or prod mode?

Please, share your source code for us to have full context.

Yes you need to rebuild your application

On Thu, Nov 30, 2023, 2:20 PM devmotion @.***> wrote:

If we add this to our app.json :

“android”: { “usesCleartextTraffic”: true }

Do we need to rebuild the app completely ? Because with EAS updates, the issue is still there for me

— Reply to this email directly, view it on GitHub https://github.com/expo/expo/issues/22887#issuecomment-1833774908, or unsubscribe https://github.com/notifications/unsubscribe-auth/A23Q2Z4G5AR5QXTGVVFSAC3YHCB3BAVCNFSM6AAAAAAZGALTSKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMYTQMZTG43TIOJQHA . You are receiving this because you commented.Message ID: @.***>

I was able to run my app without issues with the development profile, that has developmentClient: true, while my preview profile that is the same as the development, except without developmentClient defined, gave errors.

Using the following setting solved the issue:

"android": {
  "usesCleartextTraffic": true
}

I guess it defaults to true when developmentClient: true, but I expected that such a behaviour was documented in the docs (https://docs.expo.dev/build/eas-json/), because it took me some time to solve the issue, and the error itself (Network Request Failed) was not very helpful.

@juliolmuller thanks man, saved me

@juliolmuller Dude, you saved me. Thank you very much!

After updating SDK49, I face this issue on android. In dev mode every API is working perfectly, But after publishing app on android it’s not working but in iOS it’s working perfectly.

Why is this issue closed? I’m having the same issue, what would be the solution? Thanks.