Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

"Remote JS Debugger"-option gives "Connection timed out" on real device (iOS) #18629

Closed
MrsBookik opened this issue Mar 30, 2018 · 27 comments
Closed
Labels
Bug Debugger Issues related to React Native DevTools or legacy JavaScript/Hermes debugging DX Issues concerning how the developer experience can be improved. Platform: iOS iOS applications. Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@MrsBookik
Copy link

MrsBookik commented Mar 30, 2018

While I can use the Remote-debugger option perfectly on any iOS-Simulator, it is not possible anymore on real device. Both, device and developer-machine, are connected to the same WiFi. Packager is running. As long as the remote debugger is turned off, I can run the application on my iOS-Device. Making changes to the code and "Reload" on device will take effect and execute the recent code changes as expected.

As soon as I enable the option "Debug JS Remotely", the following error appears:

"Connecting to http://localhost:8081/debugger-proxy?role=client timed out"

I have tried it out with blank fresh installed React-Native projects (react-native init xxx) without any modification and on several iMac and Macbook-Machines with several iPhones (5, 6, 7, X) as well.

I also tried it out with react-native 0.52, 0.53 and 0.54.

Environment

Environment:
  OS: macOS High Sierra 10.13.3
  Node: 9.10.0
  Yarn: 1.5.1
  npm: 5.6.0
  Watchman: 4.9.0
  Xcode: Not Found
  Android Studio: 3.1 AI-173.4670197

Packages: (wanted => installed)
  react: ^16.3.0-alpha.1 => 16.3.0
  react-native: 0.54.4 => 0.54.4

Steps to Reproduce

  1. react-native init testapp
  2. cd testapp/ios
  3. open the .xcodeproj-File with XCode
  4. Select my connected iPhone as target device
  5. Run the application (either auto-spawn of "npm start" via Xcode or run it manually, it gives the same result)

Expected Behavior

Enabling the option "Debug JS Remotely" in the developer machine should also work on connected real device, not only on iOS-Simulator.

Actual Behavior

Without the "Debug JS-Remotely"-option the application can be launched as expected on connected real device as described in the official Documentation. As soon as I enable the "Debug JS Remotely"-option in developer menu, the following error occur:

Connecting to http://localhost:8081/debugger-proxy?role=client timed out

I have seen a similar issue #14186 from nearly one year ago that was already closed. Maybe this issue re-appeared in latest versions?

Screenshots:

Running the application without Remote-Debugger:

img_5994

Activate the Developer-Menu:

img_9280dc617466-1

Error after enabling the Remote-Debugger option in Developer-Menu:

img_5993

@react-native-bot react-native-bot added the Platform: iOS iOS applications. label Mar 30, 2018
@praveenkumarc86
Copy link

praveenkumarc86 commented Apr 11, 2018

I am also facing the same issue. Its working fine in iOS Simulator not only on real device. Any idea? Refered this issue and link as well.

React Version : 0.54.4

@BilalDja
Copy link

Same problem here, I'm running the app on Android simulator

"react": "16.3.1",
"react-native": "0.55.2"

Windows 10

@charlieblevins
Copy link

Same problem here as well. Verified that the 3 troubleshooting steps here are not the issue: https://facebook.github.io/react-native/docs/running-on-device.html

@Tamiyadd
Copy link

Tamiyadd commented May 8, 2018

same problem here, maybe is a bug of this version?

@Tamiyadd
Copy link

a little update that may can help someone.
I just found that, in my osx firewall, i was blocking incoming connections to node. I disabled that block and the remote debugging started working again

@praveenkumarc86
Copy link

@Tamiyadd in my case, osX firewall is off. Still i am getting this issue.

@react-native-bot
Copy link
Collaborator

Thanks for posting this! It looks like your issue may refer to an older version of React Native. Can you reproduce the issue on the latest release, v0.55?

Thank you for your contributions.

@praveenkumarc86
Copy link

@react-native-bot Yes as per @BilalDja comment

@praveenkumarc86
Copy link

remove OldVersion

@GOGOGOwzh
Copy link

same problem
Environment:
OS: macOS High Sierra 10.13.5
Node: 10.3.0
Xcode: 9.4.1
React:0.55.4

cannot connect real device

@TarasDumych
Copy link

Debugger doesn't work on the real device and network requests fail also.
RN: 0.55.3

@GOGOGOwzh
Copy link

(IOS)maybe this problem cause by Bundle Identifier ,i solve it by changing APPID which exsiting in profile,Not using default APPID

@TarasDumych
Copy link

TarasDumych commented Jun 22, 2018

@MrsBookik I solved problem by adding Allow Arbitrary Loads to Info.plist

@pigflymoon
Copy link

I have tried all those methods, finally I restart my wifi router, now it's solved amazingly, and it's weird.

@SaebaRyoo
Copy link

In my case.I've rewritten the IP address in file 'RCTWebSocketExecutor.m' ,but it doesn't work,and i provide the examination method according to the official website.There is no problem. But!When I switched to a wireless network, it worked! I don't konw why.

@wtlizzz
Copy link

wtlizzz commented Oct 22, 2018

I solved problem by kill the 8081 theard.first close your app package ,and use lsof -i:8081 in your terminal,and kill -9 your theard.

@jon-moreira
Copy link

Thanks for posting this! It looks like your issue may refer to an older version of React Native. Can you reproduce the issue on the latest release, v0.55?

Thank you for your contributions.

Same issue with version 0.55.4. can't connect iOS device. Works fine on android.

@praveenkumarc86
Copy link

I solved problem by kill the 8081 theard.first close your app package ,and use lsof -i:8081 in your terminal,and kill -9 your theard.

@lwt001no1 Can you elaborate this? Also did your phone and mac both are in same wifi or not?

@hramos hramos added Debugger Issues related to React Native DevTools or legacy JavaScript/Hermes debugging DX Issues concerning how the developer experience can be improved. and removed 🔧Tool labels Jan 29, 2019
@hramos hramos removed the Bug Report label Feb 6, 2019
@sylver
Copy link

sylver commented Apr 3, 2019

Same problem, I can't get the app running on my real iPhone - no issues on simulators - I didn't test on a real Android phone.
Tested with RN 0.58.4, 0.58.6 and 0.59.3 with React 16.8.3, tried several suggestions like #21030
Both my mac and iPhone have access to internet on the same home wifi box, no specific router or configuration.
Documentation from the website is outdated btw, which does not help.

OS: macOS Mojave 10.14.3
iOS: 12.1.4
Node: 11.11.0
Xcode: 10.1

@saudahmed
Copy link

I have been running into the same problem, I have tried all the suggested changes and still not able to run on an iOS device.

OS: macOS Mojave 10.14.3
iOS: 12.1.4
Node: 11.11.0
Xcode: 10.1

Both my mac and iPhone have access to the internet and the document is pretty much outdated

@jvandenaardweg
Copy link

jvandenaardweg commented May 30, 2019

I ran into the same problem today. Spend a few hours on it and finally got it working. There are a few solutions here which pointed me in the right direction: #21030

  1. Make sure the app is using the IP address of your machine, so not localhost, but something like 168.192.x.x or 10.0.x.x. So make sure your AppDelegate.m passes it correctly: Xcode 10 runtime warning on fresh install: nw_socket_handle_socket_event #21030 (comment)
  2. If you have your Chrome debugger open, and notice a cors error, switch to React Native Debugger, as that debugger has cors issues fixed (Xcode 10 runtime warning on fresh install: nw_socket_handle_socket_event #21030 (comment))

Those 2 steps did it for me

👍

@praveenkumarc86
Copy link

I ran into the same problem today. Spend a few hours on it and finally got it working. There are a few solutions here which pointed me in the right direction: #21030

  1. Make sure the app is using the IP address of your machine, so not localhost, but something like 168.192.x.x or 10.0.x.x. So make sure your AppDelegate.m passes it correctly: #21030 (comment)
  2. If you have your Chrome debugger open, and notice a cors error, switch to React Native Debugger, as that debugger has cors issues fixed (#21030 (comment))

Those 2 steps did it for me

👍

@jvandenaardweg your case, both mac and iphone connected in same network? mine is different, i dont have chrome debugger running. still same issue persist.

@richardhyatt
Copy link
Contributor

See #25460 - I found that the build script was not including the right IP address and thus the physical iPhone could not connect to the server.

@shawnFallon
Copy link

I found that if I deleted the app from the iphone and rebuilt it then it connected to the debugger.

@tientruongvan1995
Copy link

I'm trying so hard in 3 days and for God's sake just TURN OFF THE FIREWALL :'(((

@stale
Copy link

stale bot commented Dec 5, 2019

Hey there, it looks like there has been no activity on this issue recently. Has the issue been fixed, or does it still require the community's attention? This issue may be closed if no further activity occurs. You may also label this issue as a "Discussion" or add it to the "Backlog" and I will leave it open. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Dec 5, 2019
@stale
Copy link

stale bot commented Dec 12, 2019

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please feel free to create a new issue with up-to-date information.

@stale stale bot closed this as completed Dec 12, 2019
@facebook facebook locked as resolved and limited conversation to collaborators Dec 12, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Bug Debugger Issues related to React Native DevTools or legacy JavaScript/Hermes debugging DX Issues concerning how the developer experience can be improved. Platform: iOS iOS applications. Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests