Cannot connect to any service hosted on 127.0.0.1 (including Metro) after coming back from suspension using iPhone

[siepra]

Description

Problem occurs in a brand-new react-native project (generated following the instructions on https://reactnative.dev/docs/environment-setup?guide=native).
I'm also including a link to a repository to hack on.

It only affects physical devices.

The easiest way to observe the problem is by trying to re-connect to Metro, but what really messes things up is that the problem exists in production.

The console output looks as follows (after coming back to foreground):

[javascript] Cannot connect to Metro.

Try the following to fix the issue:
- Ensure that Metro is running and available on the same network
- Ensure that the Metro URL is correctly set in AppDelegate

The problem affects not only Metro but all services hosted on localhost, eg:

1. fetch to http://127.0.0.1:port/endpoint returns Network request failed (even though it used to work)
2. websocket client can't reconnect:

Task <A245FC72-A5ED-4995-90D1-CC8376DD395A>.<83> finished with error [-1004] Error Domain=NSURLErrorDomain Code=-1004 "Could not connect to the server." UserInfo={_kCFStreamErrorCodeKey=61, NSUnderlyingError=0x281f0d5c0 {Error Domain=kCFErrorDomainCFNetwork Code=-1004 "(null)" UserInfo={_NSURLErrorNWPathKey=satisfied (Path is satisfied), viable, interface: lo0, _kCFStreamErrorCodeKey=61, _kCFStreamErrorDomainKey=1}}, _NSURLErrorFailingURLSessionTaskErrorKey=LocalDataTask <A245FC72-A5ED-4995-90D1-CC8376DD395A>.<83>, _NSURLErrorRelatedURLSessionTaskErrorKey=(
    "LocalDataTask <A245FC72-A5ED-4995-90D1-CC8376DD395A>.<83>"
), NSLocalizedDescription=Could not connect to the server., NSErrorFailingURLStringKey=http://127.0.0.1:11000/socket.io/?EIO=4&transport=polling&t=OXJ5iK9, NSErrorFailingURLKey=http://127.0.0.1:11000/socket.io/?EIO=4&transport=polling&t=OXJ5iK9, _kCFStreamErrorDomainKey=1}

I checked and the websocket server port (11000) is still occupied after coming back to foreground, so it's not a fault of a service being offline

React Native Version

0.71.8

Output of npx react-native info

System:
OS: macOS 13.4
CPU: (12) x64 Intel(R) Core(TM) i7-9750H CPU @ 2.60GHz
Memory: 630.77 MB / 16.00 GB
Shell: 5.9 - /bin/zsh
Binaries:
Node: 18.12.1 - ~/.nvm/versions/node/v18.12.1/bin/node
Yarn: 1.22.11 - /usr/local/bin/yarn
npm: 8.19.2 - ~/.nvm/versions/node/v18.12.1/bin/npm
Watchman: Not Found
Managers:
CocoaPods: 1.11.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms: DriverKit 22.2, iOS 16.2, macOS 13.1, tvOS 16.1, watchOS 9.1
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Xcode: 14.2/14C18 - /usr/bin/xcodebuild
Languages:
Java: 15.0.2 - /Library/Java/JavaVirtualMachines/jdk-15.0.2.jdk/Contents/Home/bin/javac
npmPackages:
@react-native-community/cli: Not Found
react: 18.2.0 => 18.2.0
react-native: 0.71.6 => 0.71.6
react-native-macos: Not Found
npmGlobalPackages:
react-native: Not Found

Steps to reproduce

1. run npx react-native run-ios
2. wait for metro to complete bundling
3. make some changes to the code and see the effect of hot reload
4. lock the device (turn the screen black)
5. wait 5-10 seconds
6. unlock the device
7. make some changes to the code and see "Cannot connect to Metro" warning

Snack, code example, screenshot, or link to a repository

https://github.com/siepra/sandbox-rn

[blakef]

It might not be harmful to add support for idletimerdisabled for development builds that are run directly from the command-line (instead of Xcode). I'll look into that.

If you want to mitigate this for yourself now, open the ios/.xcworkspace and run from Xcode. That should prevent the application from sleeping.

[github-actions]

This issue is waiting for author's feedback since 24 days. Please provide the requested feedback or this will be closed in 7 days.

[github-actions]

This issue was closed because it has been stalled for 7 days with no activity.

[github-actions]

This issue was closed because the author hasn't provided the requested feedback after 7 days.