Could not connect to React Native development server on Android

Question

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

Could not connect to development server

Answer 1

Default metro builder runs on port 8081. But in my PC, this port is already occupied by some other process (McAfee Antivirus) So I changed the default running port of metro builder to port number 8088 using the following command

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

This resolved my issue and the app works fine now.

PS: You can check whether a port is occupied or not in windows using "Resource Monitor" app. (Under "Listening Ports" in "Network" tab). Check out this link for detailed explanation: https://www.paddingleft.com/2018/05/03/Find-process-listening-port-on-Windows/

Answer 2

If you are trying to debug app in your physical android device over wifi using a windows machine, then the device may not be able to access the port of your pc or laptop, you have to make the port accessible. this involves two steps:

1. First create a rule in firewall. for doing this follow the following steps:

   • 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

2. you have to make your pc accessible to outside, for doing this follow the following steps:

   • 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

You are good to go, now try running react-native run-android.

Answer 3

For me all done as mentioned above still it was not working then I followed below steps and working like charm

Go Window security => Select Firewall and network protection => Turn off private network

Answer 4

In my case, my emulator has a proxy setting, after turning it off everything works fine.

Answer 5

This is applicable to Android 9.0+ according to the Network Security Configuration. Well, so after trying all possible solutions I found on the web, I decided to investigate the native Android logcat manually. Even after adding android:usesCleartextTraffic="true", I found this in the 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

So, I tried to inspect my react-native app's source. I found that in debug variant, there is already a network-security-config which is defined by react-native guys, that conflicts with the main variant.

There's an easy solution to this. Go to <app-src>/android/app/src/debug/res/xml/react_native_config.xml Add a new line with your own IP address in the like:

<?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>

As my computer's local IP (check from ifconfig for linux) is 192.168.29.96, I added the above line in ***

Then, you need to clean and rebuild for Android!

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

I hope this works for you.

Answer 6

I got the same problem and resolve it by deleting node module package and then again install yarn. Simply on some changes we need to clear our.