无法连接到Android上的React Native开发服务器

145 人关注

When I run react-native run-android , it gives me the following error:

Could not connect to development server

  • Package server is running and I can access it directly from browser on my mobile device.
  • My Android device is connected to computer and has debugging enabled (I checked using adb devices command).
  • My Android version is 4.4.4 so I cannot use adb reverse command.
  • I have set the ID address and port in Dev setting.
  • USB debug is on.
  • I use Windows 7.
  • How to fix this error?

    5 个评论
    你看了吗? stackoverflow.com/questions/38835931/... 他运行 adb reverse 与安卓4.4.2系统
    在本地机器上运行npm start来启动开发服务器。我也遇到过同样的问题,但它对我来说就像魔法一样有效。
    由于react native的变化非常频繁,如果能把react native的版本也包括进来,那就更好了。似乎这个问题发生在小于0.59的版本上。
    localhost:19001/debugger-ui 浪费了很多时间在8081上 -- 看起来这在以后的版本中被更新了。React Native Debugger也一直在寻找8081,但当你用ctrl-t/cmd-t点击新标签时,它默认建议使用19001,而不是使用chrome开发工具,这似乎是一个更好的选择
    android
    react-native
    cityvoice
    cityvoice
    发布于 2017-02-06
    30 个回答
    itachi
    itachi
    发布于 2019-07-28
    已采纳
    0 人赞同

    在我的案例中,问题出在安卓安全策略上。根据 文件 :

    从安卓9.0(API级别28)开始,默认禁用明文支持。

    但应用程序试图通过HTTP访问Metro Bundler,对吗?这就是它不能的原因。为了启用明文流量,打开你的 AndroidManifest.xml ,将 android:usesCleartextTraffic="true" 添加到 <application> 节点。

    <application
        android:name="com.example.app"
        android:allowBackup="false"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme"
        android:usesCleartextTraffic="true">
    

    你可以在这个SO中找到更多的解决方案。https://stackoverflow.com/a/50834600/1673320.OP的问题是不同的,但类似。

    最好只在调试时应用它。参考。 stackoverflow.com/a/55147267/1489446
    如果这不可行,请看一下 stackoverflow.com/a/56744301/6740333 因为新的react native版本有一个预先定义的配置
    @ErickM.Sprengel 你提到这应该只适用于调试。如果只在 localhost 的主清单中应用,会有什么问题吗?
    它允许纯文本的http请求是不安全的,如果你意识到这一点,我认为是没有问题的。我不确定有些sdks是否会检查NetworkSecurityPolicy.isCleartextTrafficPermitted(),但我认为这不是一个问题。
    这对我来说是小米红米Note 6 pro最新的安卓更新日期。
    Yoosaf Abdulla
    Yoosaf Abdulla
    发布于 2019-07-28
    0 人赞同

    运行这个,它对我来说是有效的

    adb reverse tcp:8081 tcp:8081
        
    作者:"我的安卓版本是4.4.4,所以我不能使用adb reverse命令。"
    我的模拟器已经连接了,尽管它没有与捆绑器连接......这个命令对我有用
    @Rajat 你必须在这之后再启用它。
    它起作用了,但这是暂时的解决方案,还是adb在这个模拟器中总是反向代理这个端口?
    我的adb路径设置不正确,我无法使用adb命令,但一旦我解决了这个问题,这个解决方案就成功了。
    goldylucks
    goldylucks
    发布于 2019-07-28
    0 人赞同

    From the Docs: http://facebook.github.io/react-native/docs/running-on-device.html#method-2-connect-via-wi-fi

    方法2:通过Wi-Fi连接

    你也可以通过Wi-Fi连接到开发服务器。你会
    首先需要使用USB线在你的设备上安装应用程序,但
    一旦完成,你可以通过以下方式进行无线调试
    说明。你将需要你的开发机器的当前IP
    在继续前行之前,请将您的地址告诉我们。

    打开一个终端,输入/sbin/ifconfig来查找你的机器的IP地址。

  • Make sure your laptop and your phone are on the same Wi-Fi network.
  • Open your React Native app on your device.
  • You'll see a red screen with an error . This is OK . The following steps will fix that.
  • Open the in-app Developer menu.
  • Go to Dev Settings → Debug server host for device.
  • Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081).
  • Go back to the Developer menu and select Reload JS.
  • cityvoice
    是的,我使用Wi-Fi,而且移动设备和电脑都在同一个WIFI网络上。
    你有没有按照这些命令去做? 你能不能做一个快速的屏幕截图并作为一个gif文件上传?
    好吧,我只是想帮忙......你能不能试着用 react-native init myProject 启动一个新的项目,看看你能不能连接上,这样我们就能排除问题在你的代码中的可能性。
    在未来,每当你处理一个新的框架/工具时,如果你遇到问题,总是检查新的安装。这将帮助你更快地找到问题,并将节省别人的时间。
    @xerotolerant -- 你可以在你的命令提示中点击 adb shell input keyevent 82 来打开开发者菜单。
    Tarun konda
    Tarun konda
    发布于 2019-07-28
    0 人赞同

    从安卓9.0(API级别28)开始,默认情况下明文支持被禁用。 默认禁用。 我们可以使用android:usesCleartextTraffic="true",这将工作,但这不是推荐的解决方案。 对于 永久性的和建议的解决方案 is below:

    第1步:在android文件夹中创建一个文件 【替换代码0

    第2步:将此添加到 network_security_config.xml 中。

    <?xml version="1.0" encoding="utf-8"?>
    <network-security-config>
      <!-- deny cleartext traffic for React Native packager ips in release -->
      <domain-config cleartextTrafficPermitted="true">
       <domain includeSubdomains="true">localhost</domain>
       <domain includeSubdomains="true">10.0.2.2</domain>
       <domain includeSubdomains="true">10.0.3.2</domain>
      </domain-config>
    </network-security-config>
    

    第3步:将配置应用到你的AndroidManifest.xml中

    <application
     android:networkSecurityConfig="@xml/network_security_config">
    </application>
        
    这帮助了我。非常感谢。我只在/src/debug/AndroidManifest.xml中添加了'android:networkSecurityConfig'。
    一个更普遍的解决方案是添加所有 "本地 "网络。 【替换代码0
    Neil Agarwal
    Neil Agarwal
    发布于 2019-07-28
    0 人赞同

    这适用于安卓9.0以上版本,根据 网络安全配置 . 好吧,所以在尝试了我在网上找到的所有可能的解决方案后,我决定手动调查原生的Android logcat。即使在添加了 android:usesCleartextTraffic="true" 之后,我在logcat中发现了这个。

    06-25 02:32:34.561 32001 32001 E unknown:ReactNative: Caused by: java.net.UnknownServiceException: CLEARTEXT communication to 192.168.29.96 not permitted by network security policy
    

    所以,我试图检查我的 react-native 应用程序的源代码。我发现在debug变体中,已经有一个由 react-native 人员定义的 network-security-config,它与main变体有冲突。

    有一个简单的解决方案。 转到<app-src>/android/app/src/debug/res/xml/react_native_config.xml。 在类似的地方添加一个新的行,写上你自己的IP地址。

    <?xml version="1.0" encoding="utf-8"?>
    <network-security-config>
      <domain-config cleartextTrafficPermitted="true">
        <domain includeSubdomains="false">localhost</domain>
        <domain includeSubdomains="false">10.0.2.2</domain>
        <domain includeSubdomains="false">10.0.3.2</domain>
        ***<domain includeSubdomains="false">192.168.29.96</domain>***
      </domain-config>
    </network-security-config>
    

    由于我的计算机的本地IP(从ifconfig中查看)为192.168.29.96,我在***中添加了上述一行。

    然后,你需要为安卓系统进行清理和重建!

    cd <app-src>/android
    ./gradlew clean
    cd <app-src>
    react-native run-android
    

    I hope this works for you.

    我今天花了3个小时试图弄清楚为什么我的iOS手机可以通过USB工作,而安卓却不行,尽管安卓浏览器可以使用IP:端口地址拉动捆绑。这就是解决方案。巨大的帮助!
    Krishna Sailesh
    Krishna Sailesh
    发布于 2019-07-28
    0 人赞同

    默认情况下,metro builder运行在8081端口。 但是在我的电脑上,这个端口已经被其他进程占用了(McAfee Antivirus)。 所以我用以下命令将metro builder的默认运行端口改为8088端口

    react-native run-android start --port=8088
    

    这解决了我的问题,现在应用程序工作正常。

    PS: 你可以使用 "资源监控 "应用程序在窗口中检查一个端口是否被占用。(在 "网络 "标签的 "监听端口 "下)。请看这个链接的详细解释。https://www.paddingleft.com/2018/05/03/Find-process-listening-port-on-Windows/

    Julia Williams
    Julia Williams
    发布于 2019-07-28
    0 人赞同

    上述解决方案对我来说都不起作用。

    我只是通过点击 Ctrl+M 来打开Dev菜单,然后点击 change bundle location 并添加我的机器IP和端口。

    非常感谢你,在经历了所有可能的解决方案之后,这已经做到了,似乎物理设备想要连接到localhost......不使用模拟器的坏处我猜。
    这对我来说是个好办法,如果其他人被卡住了,也可以这样做。
    Hatchmaster J
    对我来说不起作用。这是我以前解决上述问题的方法,但现在还不够:( (Android 10, RN 63.3 )
    Daniel Le
    Daniel Le
    发布于 2019-07-28
    0 人赞同

    我的解决方案是在android/app/src/debug中修改或制作新的AndroidManifest.xml。

    <?xml version="1.0" encoding="utf-8"?>
    <manifest xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools">
        <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
        <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" />
    </manifest>
    

    我正在使用React Native版本:0.61.5

    我在设备上运行后,在Android Studio中检查了Logcat,看到 java.net.UnknownServiceException: CLEARTEXT communication to localhost not permitted by network security policy 。在添加了 android:usesCleartextTraffic="true" 并重建了应用程序后,它可以工作。
    Harsh Patel
    Harsh Patel
    发布于 2019-07-28
    0 人赞同

    React-native的解决方案 【替换代码0

    你也可以通过Wi-Fi连接到开发服务器。你将 首先需要用USB线将应用程序安装到你的设备上,但是 但一旦完成,你就可以按照以下说明以无线方式进行调试 说明。你需要你的开发机器的当前IP 地址,然后再继续。

    打开一个终端,输入 ipconfig getifaddr en0 。对于MAC

    确保你的笔记本电脑和你的手机在同一个Wi-Fi网络上。 在设备上打开你的React Native应用。

    你会看到一个带有错误的红色屏幕。这就可以了。下面的步骤将解决这个问题。

  • Open the in-app Developer menu. shake your phone or press CMD/ctrl + M
  • Click on Settings
  • click on Debug server host & port for device
  • On popup Type your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081).
  • Go back to the Developer menu and select Reload.
  • 开发者菜单中没有设置
    Shubham Kakkar
    Shubham Kakkar
    发布于 2019-07-28
    0 人赞同

    ** Ubuntu 试着只在你的根目录下运行这些命令。

  • sudo npm start -打开另一个终端

  • react-native run-android

  • 执行这个命令,然后以同样的顺序执行上述命令

    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 && react-native run-android**
        
    This will run the app in release mode & not development.
    Denys Klymenko
    Denys Klymenko
    发布于 2019-07-28
    0 人赞同
    替换代码0】到 debug/AndroidManifest.xml ,它开始工作了我已经把它从 main/AndroidManifest.xml 中删除了,并且忘记在调试中添加。

    ReactNative版本是0.61.2

    我没有debug/AndroidManifest.xml文件,是否应该添加?
    @HarryMoreno 它被自动创建并存储在 /android/app/src/debug/AndroidManifest.xml 下。
    这对我来说也是如此
    jperl
    jperl
    发布于 2019-07-28
    0 人赞同

    What solved the problem for me was to open up android studio, go into AVD manager, actions > Stop and then Cold Boot Now.

    一旦设备启动,像往常一样运行 react-native start react-native run-android

    I didn't think it would, but it worked.
    agm1984
    agm1984
    发布于 2019-07-28
    0 人赞同

    为了补充 goldylucks 的答案,你可以使用IP 192.168.0.10,如果这是你运行React Native打包器的电脑的IP。

    你可能还需要打开你的防火墙。

    在Ubuntu 18.04中,你可以通过以下方式获得你的IP。

    ip -c addr show
    

    你会看到你的IP在那里,类似于。inet 192.168.0.10/24 brd 192.168.0.255 scope global dynamic noprefixroute enp0s25(注意我的例子中的192.168.0.10)。

    然后,你可以在你的防火墙中打开8081端口,类似这样。

    sudo ufw allow 8081
    

    它将使用TCP,所以要确保TCP在8081端口开放。

    然后你可以按照goldylucks的回答,进入Dev settings,并输入192.168.0.10:8081或任何你需要的IP。

    你可以从你的设备上的浏览器中测试它。当打包器在你的电脑上运行时,从你的移动设备上导航到http://192.168.0.10:8081,并确保它工作。它将显示类似 "打包器正在运行 "的内容。它将明显地工作或失败。

    Goldylock的回答让我很兴奋,因为如果你有这种错误信息的问题,它很好地解决了这个问题。总是要重建应用程序,或者更糟糕的是,从你的设备上删除APK,然后重新建立,这很糟糕。

    因此,你可能应该使用wifi作为你的开发策略的一部分。

    Michael Tangs
    Michael Tangs
    发布于 2019-07-28
    0 人赞同

    我在native和react-native pro中也遇到了这个问题,我的解决方案是。

  • open npm server with npm start
  • run native project with Android Studio
  • transmission network request with adb reverse tcp:8081 tcp:8081
  • when you need to reload the page, just input: adb shell input keyevent 82
  • just keep it in order.

    P.S. 如果你运行了一个失败的项目,就运行 adb kill-server

    Nagibaba
    Nagibaba
    发布于 2019-07-28
    0 人赞同

    对MAC来说是最简单的。通过 ipconfig getifaddr en0 获得你的wifi网络的IP地址。然后把这个IP写到你的 DEV settings -> Debug server host & port for device 中,加入 :8081 。 例子。 192.21.22.143:8081 。然后重新加载。这就是了

    where is your Dev settings?
    摇晃设备或如果你使用苹果模拟器 cmd+D
    shake the iPhone --> 'configure bundler'
    Amit
    Amit
    发布于 2019-07-28
    0 人赞同

    发现了Android X设备的问题。

    适用于Android API 28及以上版本

    在network_security_config.xml中用cleartextTrafficPermitted="true"

    <?xml version="1.0" encoding="utf-8"?>
    <network-security-config>
      <domain-config cleartextTrafficPermitted="true">
      </domain-config>
    </network-security-config>
    

    然后,重新加载JS

    I'm currently on React Native 0.63 and ran into this issue after adding a custom network_security_config.xml to intercept some traffic with a proxy. With no custom config it seems to work fine on emulators >API 28, but if you add a custom config you will also need to allow cleartext on localhost.
    Vladimir Dimitrov Dimitrov
    Vladimir Dimitrov Dimitrov
    发布于 2019-07-28
    0 人赞同

    ifconfig

    会给你你的ip地址

    复制该Ip地址,看起来像 192.168.1.100

    cmd + M

    将显示安卓系统的调试菜单

    (万一它不工作,你可以随时使用外壳)

    adb shell 输入 keyevent 82

    Click 选择捆绑地点 并粘贴你的IP地址和端口8081(默认端口)... (应该看起来像这样)

    192.168.1.100:8081

    Click OK

    vinay gosain
    vinay gosain
    发布于 2019-07-28
    0 人赞同

    如果你试图用windows机器通过wifi调试你的实体安卓设备,那么设备可能无法访问你的电脑或笔记本电脑的端口,你必须使端口可以访问。这涉及两个步骤。

  • 首先在防火墙中创建一个规则。要做到这一点,请遵循以下步骤。

  • open run dialog
  • type wf.msc
  • click on inbound rules
  • click new rule on right hand side
  • select port from pop up menu and click next
  • select tcp port and specific local ports and enter the port number like 8081 (default)
  • allow the connection
  • select all in profile section
  • give some appropriate name and description
  • click finish
  • 你必须使你的电脑能够被外界访问,要做到这一点,请遵循以下步骤。

  • open network and sharing centre from control panel
  • change adapter settings
  • select your wifi network
  • right click, properties
  • click on sharing tab
  • check all the checkboxes
  • 你可以走了,现在试着运行react-native run-android。

    Abhishek Sengupta
    Abhishek Sengupta
    发布于 2019-07-28
    0 人赞同

    确保NPM服务器正在运行 .否则就再运行一次。它将解决这个问题。

    Mudassir Ali
    Mudassir Ali
    发布于 2019-07-28
    0 人赞同

    在尝试了所有最多人投票的答案,但都没有成功后,我想我的安卓模拟器是在飞行模式下。这很傻,但发这个帖子,可以节省一些时间。

    P.S. 在这之前,我在模拟器上进行了安全重启,这可能是我的模拟器以飞行模式启动的原因。

    Rajan rek
    Rajan rek
    发布于 2019-07-28
    0 人赞同

    If adb reverse tcp:8081 tcp:8081 this dosent work , You can restart you computer it'll work , because your serve is still running that's wrok form me.

    Devorein
    Devorein
    发布于 2019-07-28
    0 人赞同

    我通过在安卓设备中设置我的本地开发服务器的IP地址,在windows上解决了这个问题。

    utsav
    utsav
    发布于 2019-07-28
    0 人赞同

    出现这个错误是因为你的安卓虚拟设备没有连接到开发服务器。因此,检查你的安卓虚拟设备是否连接到互联网。你可以通过简单地检查WiFi连接符号和移动数据符号来做到这一点。

    zvv
    zvv
    发布于 2019-07-28
    0 人赞同

    对我来说,当我使用 react-native run-android 从Android Studio而不是命令行构建时,就发生了这种情况。

    0 人赞同

    这个问题已经发生在我身上好几次了。前一分钟还在工作,后一分钟就停止工作了,我没有做任何改变。 错误中的第二个IP通常是10.0.2.x而不是192.x。

    我已经看了所有的答案,但无法解决这个问题。

    最终,有一件事一直有效,那就是回到Android Studio,打开AVD,然后选择有问题的模拟器。做一个Duplicate(复制)来创建另一个模拟器的副本,然后一切都会神奇地再次工作。

    所以我的猜测是,模拟器文件夹里的东西被损坏了。

    Mayank Chaurasia
    Mayank Chaurasia
    发布于 2019-07-28
    0 人赞同

    这很可能是一个防火墙问题。如果有人使用ubuntu面临这个问题,那么你可以使用

    sudo service iptables stop
    

    禁用防火墙,使该端口可以被访问。

    Rishav Kumar
    Rishav Kumar
    发布于 2019-07-28
    0 人赞同

    首先,我感谢你发表你的疑问。 这主要是因为你的博览会或你运行react native项目的应用程序可能不在同一个本地连接的WIFI或LAN中。 另外,也有可能是你的连接经常受到干扰,导致它失去了连接。

    我也面临这个问题,我个人清除了缓存,然后再次重启,嘣,它完美地重启了。 我希望这对你也有用!

    Mahdi Farhani
    Mahdi Farhani
    发布于 2019-07-28
    0 人赞同

    在我的情况下,我的模拟器有一个代理设置,在关闭它之后,一切都很正常。

    How do I turn it off?
    @VikasSatpute 你用哪种模拟器?
    安卓模拟器 - Pixel 3 Xl API: 28:554
    Sarojini2064130
    Sarojini2064130
    发布于 2019-07-28
    0 人赞同

    基本上这个错误是在npm服务器没有启动的时候出现的。

    所以,首先要检查npm服务器的状态,如果它没有运行,就用 npm start 命令启动npm,你可以在终端看到。

    加载依赖关系图完成。

    现在npm已经启动,在另一个终端用命令运行你的应用程序