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
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 theusesCleartextTrafficpropoerty for building process. Therefore myapp.jsonfile stays like this:https://www.ssllabs.com/ssltest/analyze.html?d=gareebmatka.com
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.configis defined and unchanged for the build (indevelopmentClientbuilds, 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:
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:
I was able to run my app without issues with the
developmentprofile, that hasdevelopmentClient: true, while mypreviewprofile that is the same as thedevelopment, except withoutdevelopmentClientdefined, gave errors.Using the following setting solved the issue:
I guess it defaults to
truewhendevelopmentClient: 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.