'React-native: "could not connect to development server"- android app

I am following guide on starting react.js. http://code.tutsplus.com/tutorials/creating-a-dictionary-app-using-react-native-for-android--cms-24969 I installed node, react, android studio and genymotion emulator. When I get to the part of building app in emulator, I get this error:

error build image

I activated USB debuggin tool. When I try to run adb devices command in command prompt, it gives me nothing.



Solution 1:[1]

I would suggest 2 steps (both were required to solve my issue)

  1. Turn off your local firewall. On osx, go to "Security & Privacy" -> "Firewall" -> Click lock icon -> "Turn off Firewall"

  2. The default port 8081 may be in use (even if the lsof command suggests otherwise). Try another port on start: react-native start --port=8088

    And on your device, shake it to get the dev menu, tap "Dev Settings" -> "Debug server host & port for device" -> enter "XX.XX.XX.XX:8088" (where x's are your local IP)

Solution 2:[2]

On Android 9, you will need to add the follwing in application tag of ./android/app/src/debug/AndroidManifest.xml

android:usesCleartextTraffic="true"

https://github.com/facebook/react-native/issues/15388#issuecomment-505187651

Solution 3:[3]

It looks like the server is not accessible from the phone.

Possible causes:

  • Server might not be running
  • The IP address might be wrong
  • Phone cannot access the IP address

Solution:

If you are connecting the phone via USB. Reverse TCP the port number 8081 by running the following command

 adb reverse tcp:8081 tcp:8081

Solution 4:[4]

I used a usb cable with wifi and for me the solution was to use: 'localhost:8081'

  1. open the in-app Developer menu. shake your phone or press CMD/ctrl + M
  2. click on Settings
  3. click on Debug server host & port for device
  4. write 'localhost:8081'
  5. in terminal write 'adb reverse tcp:8081 tcp:8081'

Go back to the Developer menu and select Reload.

Solution 5:[5]

Depending on where I'm building from, I'm not able to use my local IP to run the a React Native app (typically public networks like coffee shops). The best way I've been able to figure it out is to use a tool called ngrok to make a public tunnel to your localhost.

Once you've installed it, just run ngrok http 8081 (or whatever port your using for the packager). It will spin up the tunnel and give you a url (like http://123j2h3s.ngrok.io). On the app, shake to open the developer settings, touch Dev Settings, then under Debugging touch Debug server host & port for device and enter the ngrok url there (no need to add http://).

Hope this helps!

Solution 6:[6]

You need to follow below commands to get the npm start again :

1) sudo lsof -n -i4TCP:8081 | grep LISTEN

2) kill -9 (enter the process id here returned from above command).

Solution 7:[7]

I was having a similar issue with my emulator in Ubuntu 16.04. In my case the problem was that node packager wasn't running.

To check is packager is running easily you can open the browser and enter

http://localhost:8081/

You must see "React Native packager is running."

If you dont, then you can start packager from console running

react-native start

If you get an error like

" ERROR watch /your/project/path/android/app/build/intermediates/incremental/mergeDebugResources/merged.dir/values-ru ENOSPC"

Then run first

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

Then run react-native start again and press the letter R twice in the emulator to reload.

Solution 8:[8]

This might help

adb kill-server
adb start-server
adb reverse tcp:8081 tcp:8081

Solution 9:[9]

add android:usesCleartextTraffic="true" to your application, in the manifest

 <application
       ....
       android:usesCleartextTraffic="true"
       android:theme="@style/AppTheme">

Solution 10:[10]

To run with local server, run the following commands under your react-native project root directory

  1. react-native start > /dev/null 2>&1 & 2 .adb reverse tcp:8081 tcp:8081

To run without a server, bundle the jsfile into the apk by running:

1.create an assets folder under android/app/src/main 2. curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 niltoid
Solution 2 andho
Solution 3 Sriraman
Solution 4
Solution 5 BradByte
Solution 6 Rajesh
Solution 7 Martinez Mariano
Solution 8
Solution 9 kamalesh biswas
Solution 10 ashutosh pandey