无法连接远程调试器

Question

我正在使用React.JS，当我react-native run-android（我的设备已插入）时，我看到一个空白页面。当我摇动设备并从选项列表中选择Debug JS Remotely时，我会看到以下屏幕。

仅供参考：

OS: Ubuntu 16.04
Node version is: v4.6.2
java version "1.8.0_111"
react": "15.4.1
react-native": "0.38.0

Answer 1

为我解决了以下问题：

• 在仿真器屏幕上按Cmd + M
• 转到Dev settings > Debug server host & port for device
• 设置localhost:8081
• 重新运行Android应用：react-native run-android

调试器现已连接！

Answer 2

我在手机上执行adb reverse tcp:8081 tcp:8081然后reload解决了这个问题。

Answer 3

在我的情况下，选择 Debug JS Remotely 启动了Chrome，但没有连接到Android设备。通常情况下，新的Chrome标签/窗口会在地址栏中预先填充调试网址，但在这种情况下，地址栏为空白。超时后，＆＃34;无法连接远程调试器＆＃34;显示错误消息。我用以下程序解决了这个问题：

• 运行adb reverse tcp:8081 tcp:8081
• 将http://localhost:8081/debugger-ui粘贴到Chrome浏览器的地址栏中。您应该会看到正常的调试屏幕，但您的应用仍然无法连接。

那应该解决问题。如果没有，您可能需要采取以下额外步骤：

• 从Android设备关闭并卸载该应用
• 使用react-native run-android
重新安装应用
• 在您的应用上启用远程调试。
• 您的应用现在应该连接到调试器。

Answer 4

我遇到了类似的问题，导致我提出了这个问题。在我的浏览器调试器中，我收到以下错误消息：

  

通过CORS策略阻止从原点“ http://localhost:8081/index.delta?platform=android&dev=true&minify=false”到“ http://127.0.0.1:8081”的访存：所请求的资源上没有“ Access-Control-Allow-Origin”标头。如果不透明的响应满足您的需求，请将请求的模式设置为“ no-cors”以在禁用CORS的情况下获取资源。

我花了一段时间才意识到我在调试器中使用的是127.0.0.1:8081而不是localhost:8081。

要解决此问题，我只需要将Chrome从以下位置更改：

http://127.0.0.1:8081/debugger-ui/

到

http://localhost:8081/debugger-ui/

Answer 5

确保提供捆绑包的节点服务器在后台运行。要运行启动服务器，请使用npm start或react-native start并在开发期间保持选项卡处于打开状态

Answer 6

我的情况是，当我点击启用远程JS调试时，它将启动chrome，但无法连接到它。

我试图跑：

adb reverse tcp:8081 tcp:8081 

，但没有奏效。

我完全卸载了我的chrome并安装了一个新的。它有效。

Answer 7

在一个选项卡中
1. react-native start --reset-cache ，在另一个选项卡中 react-native run-android
2. adb反向tcp：8081 tcp：8081 （因此您可以将其添加到脚本中，然后运行 yarn run adb-reverse ）
3. 如果您使用的是android，则可以运行 adb命令，而不是摇动手机。

因此您可以运行：

• adb shell输入键盘事件82 （菜单选项）
• adb shell输入键盘事件46 46 （ reload ）

Answer 8

这里的其他答案对我来说是重要的一步。在AndroidManifest.xml中，我需要添加usesCleartextTraffic：

docker-compose down
docker-compose build
docker-compose up

但是，除非您希望支持不安全的http请求，否则您可能不想将其保留在应用的生产版本中。

将其添加到AndroidManifest.xml中之后，我遵循了Tom Aranda的回答，并且模拟器终于能够连接到调试器。

Answer 9

我做了@sajib的回答，并使用此脚本来重定向端口：

#!/usr/bin/env bash

# packager
adb reverse tcp:8081 tcp:8081
adb -d reverse tcp:8081 tcp:8081
adb -e reverse tcp:8081 tcp:8081

echo " React Native Packager Redirected "

Answer 10

专家开发人员Ribamar Santos特别提供了所有令人印象深刻的答案，如果您无法正常工作，则必须检查一些更棘手的东西！

类似于您的（模拟）电话的Airplane mode！或者您的network status of Emulator（Data status and Voice status on Cellular tab of Emulator configuration）可能被操纵为不表示网络！满足某些仿真需求！

我已经通过这个技巧克服了这个问题！找到这个漏洞真是令人叹为观止！

Answer 11

就我而言，它还需要安装npm软件包

如此

npm install react-native-debugger -g

Answer 12

尝试添加此内容

package.json

devDependencies: {
//...    
    "@react-native-community/cli-debugger-ui": "4.7.0"
}

终结一切。

• npm install
• npx react-native start
• npx react-native run-android

参考：https://github.com/react-native-community/cli/issues/1081#issuecomment-614223917

Answer 13

使用 React Cli 和 Typescript/js（Android 模拟器）对 React Native 进行故障排除

1. 检查“android/src/mai/assets/index.android.bundle”是否可用。如果没有在 'android/src/main/assets' 中创建 index.android.bundle 文件
2. 如果上述路径不可用，则创建路径然后创建文件 3.运行打包： react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-目标 android/app/src/main/res

4.a.默认情况下，开发服务器在 8081 端口上运行。运行“react-native start”，然后在浏览器上检查“http://localhost:8081”和“http://yourIP:8081”是否有效。如果是，那么 在 Android 模拟器中打开应用程序（react-native run-android）

• 点击 Ctrl + M
• 选择设置
• 为设备选择调试服务器主机和端口
• 添加“您的IP地址：8081”，例如10.0.2.2:8081

4.b 如果 http://localhost:8081 不起作用，则在成功执行后运行 react-native port=8088（或任何端口）。检查浏览器 http://localhost:8088 和 http://yourIP:8088 是否有效。是然后在 Android 模拟器中打开应用程序 (react-native run-android)

• 点击“Ctrl + M”
• 选择设置-
• 为设备选择调试服务器主机和端口-
• 添加“您的IP地址：8081”，例如10.0.2.2:8088

YourIPAddress : Open command promt -> write 'ipconfig' -> copy IPv4 address

Answer 14

至于我自己的情况，我使用 expo go 和我的 android 手机作为我的模拟器，它给了我这个错误。

• 所以我所做的是清除我的 android 设备上的 expo go 应用程序缓存和数据，然后繁荣。它工作得很好

Answer 15

确保您没有意外按下模拟器上的“远程停止调试JS”。如果在模拟器上打开开发人员工具时显示“远程调试JS”，而不是停止它。