react-native: Regression: Cannot connect to packager via IP or physical ios devices
đź’Ą Regression Report
Upgraded to RN 0.59.0, and tried to run my app on ios. When I tried to enable remote debugging, I got an error saying that the connection to http://localhost:8081/debugger-proxy?role=client timed out.
I followed the troubleshooting here: http://facebook.github.io/react-native/docs/running-on-device.html#troubleshooting, and confirmed that my local machine’s IP address is being detected correctly.
I then tried opening the debugger-ui on chrome by navigating to my local ip (ie 10.27.79.224:8081/debugger-ui) and it failed to connect. This definitely worked in RN 0.57 (from which I upgraded). Testing on RN 0.58.6, this also works.
Last working version
Worked up to version: 0.58.6
Stopped working in version: 0.59.0
To Reproduce
Install React Native version 0.59.0. Run npm start
to start the packager. Obtain the local machine’s IP, and then navigate to the obtained IP:8081/debugger-ui. Connection should be refused, and debugging on a physical ios device is not possible.
Expected Behavior
I expect to be able to debug remotely from a physical ios device.
Code Example
n/a
Environment
React Native Environment Info:
System:
OS: macOS 10.14.3
CPU: x64 Intel(R) Core(TM) i5-8259U CPU @ 2.30GHz
Memory: 432.55 MB / 16.00 GB
Shell: 5.3 - /bin/zsh
Binaries:
Node: 8.15.0 - ~/.nvm/versions/node/v8.15.0/bin/node
Yarn: 1.13.0 - ~/.nvm/versions/node/v8.15.0/bin/yarn
npm: 6.4.1 - ~/.nvm/versions/node/v8.15.0/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
SDKs:
iOS SDK:
Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
Android SDK:
Build Tools: 23.0.1, 27.0.3, 28.0.3
API Levels: 23, 26, 27, 28
IDEs:
Android Studio: 3.3 AI-182.5107.16.33.5199772
Xcode: 10.1/10B61 - /usr/bin/xcodebuild
npmPackages:
@types/react: 16.3.14 => 16.3.14
@types/react-native: 0.57.11 => 0.57.11
react: 16.8.4 => 16.8.4
react-native: 0.59.0 => 0.59.0
npmGlobalPackages:
react-native-cli: 2.0.1
react-native-git-upgrade: 0.2.7
About this issue
- Original URL
- State: closed
- Created 5 years ago
- Reactions: 3
- Comments: 18 (5 by maintainers)
You just need to add a new line with your device ip into android/app/src/debug/res/xml/react_native_config.xml
Like this :
Thanks for providing comments and reproductions here. Let’s make sure that this gets fixed in 0.59 / 0.60. I am going to put a todo on this issue and be back to it this week to see what’s going on.
@grabbou I got this working by adding
--host `ipconfig getifaddr en0`
to my start script.I didn’t have time to figure out why this used to work prior to 0.59, but it seems that it is probably related with
react-native-cli
. The folks over there are also not too sure what the purpose of thehost
flag is: https://github.com/react-native-community/react-native-cli/issues/195Hi @grabbou
Thanks for getting back on this. For interests sake, did you try to reproduce this issue?
I do believe it’s an issue and was unrightfully closed. This is functionality that works perfectly fine on
0.58.6
but doesn’t on0.59.0
without any changes in my set up.So I don’t think this is due to running on different IP ranges, plainly because it works fine when running on a previous version of RN.
Also as stated in the OP, in RN 0.59 you can not even navigate to the debugger-ui using the machine hosting the packager using its IP, but you can in RN 0.58.6.
@ScreamZ doesn’t seem to do anything on my end. Unless the
debug
settings aren’t taking effect, that cleartext traffic flag is set inapp/src/debug/react_native_config.xml
already, so you shouldn’t need to add it to theapplication
tag again.It’s so odd, I have asked a few others who are into 0.59.x and they aren’t having the same issue… The fact that it doesn’t work for me on iOS and Android, and it does work for others, makes it feel like something else on my system is different. Possible I have some other network process running on a required port or just some other system level network setting?
I just fixed the issue on Android using this seems related to android 9.
https://stackoverflow.com/posts/50834600/revisions
A little
android:usesCleartextTraffic="true"
did the trick on<application
tag.Oh snap! I’ve read this was Android issue (which we have fixed yesterday locally by updating the XML as suggested).
I have no problems running iOS on a device - but going to double check.
Experiencing this on Android as well. Attempted to debug with my 192.168.x.x and 8081 port. Experiencing “Could not connect to development server.” on both a fresh react-native init project along with a project upgraded from 0.58.6.