React Native update 0.63.0 breaks login function on real iPhone

Question

I just updated React Native to version 0.63.0 and my app breaks when i attempt to login with a real iPhone device, but it works with the simulator.

I started expo, scanned the QR code as usual but when i attempt to login im getting a Network Error.

This is my login function:

const login = () => {
axios.post(`http://localhost:3000/v1/sessions`, login_params)
.then(res => {
  if (res.status == 201){
   navigation.navigate('Home')
   storeData(res.data)
  }else {
    Alert.alert('Wrong email or password')
  }
})
.catch(function(error) {
  console.log(error.message);
    throw error;
  })
}

An i am getting the following error: Network Error

[Unhandled promise rejection: Error: Network Error]

node_modules/axios/lib/core/createError.js:15:17 in createError
node_modules/axios/lib/adapters/xhr.js:88:22 in handleError
node_modules/event-target-shim/dist/event-target-shim.js:818:20 in EventTarget.prototype.dispatchEvent
node_modules/react-native/Libraries/Network/XMLHttpRequest.js:600:10 in setReadyState
node_modules/react-native/Libraries/Network/XMLHttpRequest.js:395:6 in __didCompleteResponse
node_modules/react-native/Libraries/vendor/emitter/EventEmitter.js:189:10 in emit
node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:416:4 in __callFunction
node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:109:6 in __guard$argument_0
node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:364:10 in __guard
node_modules/react-native/Libraries/BatchedBridge/MessageQueue.js:108:4 in callFunctionReturnFlushedQueue

[native code]:null in callFunctionReturnFlushedQueue

I have tried to hard restart expo. Empty caches.

Does any one have an idea of why i am getting Network Error.

score 0 · Accepted Answer · answered Oct 05 '20 at 19:18

localhost is not available to the real device, either use your Mac's ip or deploy your backend on the web and use that url.

If your Mac and iPhone both are on same wifi network you can use your Mac's ip address instead of localhost. So your url will be something like http://192.169.0.100:3000/v1/sessions instead of http://localhost:3000/v1/sessions. You can use the command ifconfig to find your ip address.

If you still can't access your rails server on your iPhone make sure the server is available on the local network. Here is a similar question regarding that.

React Native update 0.63.0 breaks login function on real iPhone

1 Answers1