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

My solution is modify or make new AndroidManifest.xml in android/app/src/debug:

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

I am using React Native version: 0.61.5

Answer 2

Easiest for MAC. Get ip address of your wifi network via ipconfig getifaddr en0. Then write that ip to your DEV settings -> Debug server host & port for device adding :8081 example. 192.21.22.143:8081. Then reload. That's it

Answer 3

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

Method 2: Connect via Wi-Fi

You can also connect to the development server over Wi-Fi. You'll
first need to install the app on your device using a USB cable, but
once that has been done you can debug wirelessly by following these
instructions. You'll need your development machine's current IP
address before proceeding.

Open a terminal and type /sbin/ifconfig to find your machine's IP address.

1. Make sure your laptop and your phone are on the same Wi-Fi network.
2. Open your React Native app on your device.
3. You'll see a red screen with an error. This is OK. The following steps will fix that.
4. Open the in-app Developer menu.
5. Go to Dev Settings → Debug server host for device.
6. Type in your machine's IP address and the port of the local dev server (e.g. 10.0.1.1:8081).
7. Go back to the Developer menu and select Reload JS.

Answer 4

In my case the problem was with Android security policies. According to the documentation:

Starting with Android 9.0 (API level 28), cleartext support is disabled by default.

But the application tries to access Metro Bundler through HTTP, right? And that's why it can't. In order to enable cleartext traffic, open your AndroidManifest.xml and add android:usesCleartextTraffic="true" to <application> node.

For example:

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

You can find more solutions in this SO: https://stackoverflow.com/a/50834600/1673320. OP's problem is different, but similar.

Answer 5

When I started a new project

react-native init MyPrroject

I got could not connect to development server on both platforms iOS and Android.

My solution is to

sudo lsof -i :8081
//find a PID of node
kill -9 <node_PID>

Also make sure that you use your local IP address

ipconfig getifaddr en0

Answer 6

Run this and it worked for me

adb reverse tcp:8081 tcp:8081