23

I'm trying to do the react native 'hello world', and I'm using usb debugging on my android.

I ran react-native run-android, then react-native start.

I can view the js file in localhost, but get 'could not connect to development server' message on my phone.

I followed the instructions to run adb reverse tcp:8081 tcp:8081, then realized that command doesn't exist, so I ran adb forward tcp:8081 tcp:8081 instead.

Still no luck. Using react-native@0.22.0, ubuntu 14.04. My phone is nexus 5 on android 6.0.1.

How can I allow my phone to access my localhost?

By the way, it is working over wifi, but I'd like to get it working over usb.

James Bowler
  • 2,194
  • 2
  • 17
  • 23
  • Going to `localhost` on the device, is the device itself. Did you try using the actual ip address? – OneCricketeer Mar 22 '16 at 19:09
  • Right, I tried to use the forward command to forward to my pc's localhost (I think that's the way it works). That did not work. Using my ip address, and wifi, did work. I'd like to use usb, however, and can't get that to work. – James Bowler Mar 22 '16 at 20:31
  • Use usb for what exactly? The internet connection doesn't go over usb – OneCricketeer Mar 22 '16 at 20:31
  • If I interpreted `adb forward` correctly online, it forwards **from the PC** and **to the device** – OneCricketeer Mar 22 '16 at 20:33
  • OK, good to know. The troubleshooting info seems to give 2 options, one wired, one wireless. 1. If you're on a wired connection, run 'adb reverse ...'. 2. If your device is on the same wifi network, you can put in your computer ip/port. I can do #2, but cannot do #1. How do I do #1, given that 'reverse' is no longer an option for the adb command? – James Bowler Mar 22 '16 at 23:13
  • I have the exact same problem running the Hello World app in the emulator. – zrooda Jun 20 '16 at 18:32
  • Just for fun, I started from the beginning to try to recreate this. It worked this time. I think because they added this to the docs: "A common issue is that the packager is not started automatically when you run react-native run-android. You can start it manually using: cd AwesomeProject react-native start" – James Bowler Jun 21 '16 at 20:57
  • How exactly did you solve the problem? `adb forward` did not work for me. I am on android 4.3 – Bhumit Mehta Jul 22 '16 at 11:05
  • Well, like I wrote, the thing that I think fixed it for me was the 'react-native start'. What's the error you're seeing? I'm also on android 6. – James Bowler Jul 23 '16 at 17:24

6 Answers6

26

Just another scenario, this error happened to me when I forgot to run react-native start command. I usually follow the steps here when I start new project. The steps in a nutshell are as follows (Android in my case):

  • Start Android Studio -> AVD Manager -> select your aVD and click Start from action

  • inside the directory where you want to create your new project, open your command line and run:

    $ react-native init <Your new project name/it is also the registration name>
$ cd <the new directory you created>
$ react-native start  //This is the step that I forgot

  • Open a new command prompt and run the following inside the same directory(you just created) to launch the app on your AVD.

    $ react-native run-android

  • If everything is set up correctly, you should see your new app running in your Android emulator shortly.

  • You'll find in the file index.android.js in the home directory of your project, the last line contians the App registry using the same name you used in the first command above

Hawk
  • 5,060
  • 12
  • 49
  • 74
  • 11
    The command `react-native start` is completely missing at the official _React Native Getting Started_ guide. Thanks for pointing out! – Frébo Mar 01 '17 at 19:07
  • This solution (two terminals) was the only one that worked for me. Very easy to miss. Thank you! – chewinggum Jul 05 '20 at 01:24
10

adb reverse tcp:8081 tcp:8081 Only works for android 5.0 + for running app on devices with android versions lesser than 5.0 hit following command after npm start is done in Terminal (in app directory folder).

curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle"

now run the app, it will work. Only drawback is that every time you make a change you need to fire the command again and run the app again.

Bhumit Mehta
  • 16,278
  • 11
  • 50
  • 64
4

I found the solution :)

I am on ubuntu 16, so, I used command ip addr show which gave me my computer ip address.

I used this ip address and I was able to access localhost on my mobile.

Finally I added the ip address and port no to devsettings of android phone and My app was able to access development server

HpDev
  • 2,789
  • 1
  • 15
  • 20
2

10 mins ago I had the same problem I guess, and the way I solved this was reading this

https://facebook.github.io/react-native/docs/running-on-device-android.html

and when I did that, I found that I didn't have android-tools-adb installed, so looking around I found

'No command 'adb' found' error on Ubuntu

which gives me the answer

sudo apt-get install android-tools-adb

and after all this I set 

export PATH=${PATH}:~/android-sdk-linux/tools
export PATH=${PATH}:~/android-sdk-linux/platform-tools

then everything works fine, now I can see my app in my Android device.

BTW the option I choose from react native docs was the one that says me

"Using adb reverse

Note that this option is available on devices running Android 5.0+ (API 21). Have your device connected via USB with debugging enabled (see paragraph above on how to enable USB debugging on your device).

Run adb reverse tcp:8081 tcp:8081

You can use Reload JS and other development options with no extra configuration

Community
  • 1
  • 1
Abraham Aguiñaga
  • 21
  • 3
  • 3
    Using `adb reverse` worked with my android 5.0+, but I can not run on devices 4.0, what can I do? – Douglas Nassif Roma Junior Jul 06 '16 at 13:02
  • @DouglasJunior adb reverse was introduced in android version 5.0. try this: 1.) run - react native start 2.) then run - curl "http://localhost:8081/index.android.bundle?platform=android" -o "android/app/src/main/assets/index.android.bundle" 3.) wait 4.) run react-native run-android – Damathryx Aug 26 '16 at 12:09
1

I am having seen the same issue, and that's all because the android app don't have this permission:

<uses-permission android:name="android.permission.INTERNET" />
Diogo Fernandes
  • 41
  • 5
0

I had a similar problem. I would get this error when trying to get it to run on device. It was working fine on my simulators on my computer.

The problem was when I would do adb devices or react-native run-android I would get "ADB is Not Recognized as an internal or external command".

So my fix was to add the path to adb.exe's parent directory to my Environment Variables and then restart my command prompts. After I did that, adb devices would not throw the "unrecognized internal external blah" and it listed my device. I then ran react-native run-android and on startup no more red screen showing the completely useless error message Error calling AppRegistry.runApplication! :)

So I found ADB was located in my folder:

C:\Users\dell\AppData\Local\Android\sdk\platform-tools\adb.exe I am on a Windows 10 system. dell is my user name of the computer.

So I went to System Environemnt Variables then found "Path" then clicked "Edit", then clicked "New" and added in "C:\Users\dell\AppData\Local\Android\sdk\platform-tools".

Manuj Vashist
  • 23
  • 1
  • 5