无法连接远程调试器

Posted 2023-02-19

【中文标题】无法连接远程调试器

【英文标题】：Unable to connect with remote debugger

【发布时间】：2017-04-15 09:36:11

【问题描述】：

我正在使用 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

【问题讨论】：

在 Android 上，您需要在单独的窗口中运行 react-native start 才能启动服务器。

如何改变这个：compile "com.facebook.react:react-native:+" 在编译部分。

你应该在开发菜单中启用“调试”

【参考方案1】：

在我的情况下，问题是模拟器正在发出请求：

http://10.0.2.2:8081/debugger-ui

代替：

http://localhost:8081/debugger-ui 并且请求失败。

要解决此问题：在您的模拟器上启用远程调试之前，请在 chrome 中打开 http://localhost:8081/debugger-ui。然后启用远程调试并返回 chrome 页面，您应该会在其中看到控制台日志。

【讨论】：

为我工作——谢谢！您是否找到一种方法将其设置为始终尝试连接到 localhost 以避免必须先打开 chrome 选项卡？

您可以进入模拟器上的开发设置 (Ctrl +M) 并将调试服务器更改为 'localhost:8081'。

最后一段是唯一对我有用的东西。

谢谢。首先它是如何设置为 10.0.2.2 的？

从您的模拟器发出的对“localhost”的请求将尝试访问模拟器上的环回端口，而不是您的 PC（您想要 PC 的环回）。为了解决这个问题，android 创建了别名 10.0.2.2 以允许您访问在您的 PC 上运行的服务（请参阅developer.android.com/studio/run/emulator-networking 以获取文档参考）。至于为什么请求失败，我不确定，但它似乎是 react/android 的一个记录问题，请参阅github.com/facebook/react-native/issues/17970。

【参考方案2】：

解决了以下问题：

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

调试器现已连接！

【讨论】：

对于 CMD + M 按钮不起作用的问题，我在 adb 所在的 shell 中使用了 './adb shell input keyevent 82' 来触发它。之后快捷键开始起作用了！

你先生是一个血腥的传奇。 x

现在它只是试图连接到远程调试器......永远

Cmd + M 和 ./adb 都不工作我如何连接调试器？

【参考方案3】：

我在手机上通过adb reverse tcp:8081 tcp:8081 和reload 解决了这个问题。

【参考方案4】：

在我的例子中，选择 Debug JS Remotely 启动了 Chrome，但没有连接到 android 设备。通常，新的 Chrome 选项卡/窗口会在地址栏中预先填充调试 URL，但在这种情况下，地址栏是空白的。超时时间过后，显示“无法与远程调试器连接”错误消息。我通过以下程序解决了这个问题：

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

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

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

【讨论】：

汤姆...谢谢！在此之前，我设置了我的 IP 地址（“Dev Settings”->“Debug server host for device”）x.x.x.x:8081

【参考方案5】：

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

CORS 策略已阻止从源“http://127.0.0.1:8081”获取“http://localhost:8081/index.delta?platform=android&dev=true&minify=false”的访问权限：请求的资源上不存在“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/

【讨论】：

实际上对我来说正好相反。但实际上“localhost”通常相当于 127.0.0.1。这取决于为地址设置为 localhost 的内容。虽然总是更好地明确

【参考方案6】：

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

我尝试过运行：

adb reverse tcp:8081 tcp:8081 

，没用。

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

【参考方案7】：

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

【讨论】：

还是不行。两个终端都没有返回错误

你是否在运行任何代理服务器或像 charles 这样的代理软件...如果有的话就停止它们

不，我没有运行任何代理

【参考方案8】：

这里的其他答案对我来说缺少一个关键步骤。在 AndroidManifest.xml 我需要添加 usesCleartextTraffic:

    <application
      ...
      android:usesCleartextTraffic="true">

您可能不想在应用的生产版本中保留它，除非您想支持不安全的 http 请求。

在我将它添加到我的 AndroidManifest.xml 之后，我按照 Tom Aranda 的回答，模拟器终于能够连接到调试器。

【参考方案9】：

react-native start --reset-cache 在一个选项卡中，react-native run-android 在另一个选项卡中 adb reverse tcp:8081 tcp:8081（这样您就可以将其添加到您的脚本中，然后运行 ​​yarn run adb-reverse） 如果您使用的是 android，最好不要摇晃手机，而是运行 adb 命令。

所以你可以运行：

adb shell input keyevent 82

（菜单选项）

adb shell input keyevent 46 46

(reload)

【参考方案10】：

我做了@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 ?"

【参考方案11】：

卸载您的应用程序，然后运行 ​​react-native run-android。然后点击调试结束在chrome替换http://localhost:8081/debugger-ui/，结束运行react-native run-android。如果还没有成功，请再试一次

【参考方案12】：

包含专家开发人员特别Ribamar Santos 提供的所有令人印象深刻的答案，如果你没有得到它的工作，你必须检查一些更棘手的东西！

类似于您（模拟）手机的Airplane mode！或者你的network status of Emulator (Data status and Voice status on Cellular tab of Emulator configuration) 可能被操纵不表达网络！满足一些仿真需求！

我已经通过这个技巧克服了这个问题！发现这个洞有点惊险！

【参考方案13】：

在我的情况下，它还需要安装它的 npm 包

所以

npm install react-native-debugger -g

【参考方案14】：

尝试添加这个

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

【参考方案15】：

使用 React Cli 和 Typescript/js（Android 模拟器）解决 React Native 问题

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

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

点击 Ctrl + M 选择设置 为设备选择调试服务器主机和端口 添加 'YourIPAddress:8081' 例如10.0.2.2:8081

4.b 如果 http://localhost:8081 不起作用，则在成功执行后运行 react-native port=8088（或任何端口）。检查浏览器 http://localhost:8088 和 http://yourIP:8088 是否有效。 Yes then Open application in Android Emulator (react-native run-android)

点击“Ctrl + M” 选择设置- 为设备选择调试服务器主机和端口- 添加 'YourIPAddress:8081' 例如10.0.2.2:8088

YourIPAddress : 打开命令提示符 -> 写入 'ipconfig' -> 复制 IPv4 地址

【参考方案16】：

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

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