YaSh Chaudhary
YaSh Chaudhary

Reputation: 2725

Network Response Time Out Error (create-react-native-app) (expo)

I am trying to run create-react-native-app on expo app in android.

Firstly ,I created the project by writing command

create-react-native-app test

then I executed

npm start

then scanned the qr code from expo app.

But after scanning QR code , I am getting following error:

Uncaught Error: Java.net,sockettimeoutException: failed to connect to after 10000ms

enter image description here

Github Issue:

https://github.com/react-community/create-react-native-app/issues/144#issuecomment-296631692

Upvotes: 85

Views: 111587

Answers (30)

Yeon
Yeon

Reputation: 19

This actually works for me !!! The issue actually comes from the fact that Node.js JavaScript Runtime is not enabled in the Inbound rules in the Firewall. After enabling it, I can finally run the app on Expo Go on my iPhone. https://stackoverflow.com/a/70785955/9207104

enter image description here

Upvotes: -1

discretematt
discretematt

Reputation: 21

If you are running on Ubuntu, check your UFW status.

sudo ufw status

If it is inactive, enable it with

sudo ufw enable

Go back to your React native project and restart the metro builder scan the QR code. Everything should work unless you have some other issues(upgrade of expo ect) to deal with.

Upvotes: 0

Shubham
Shubham

Reputation: 61

My problem is solved by navigating to my project folder and running the below commands:

expo start --tunnel

then start android app by typing

a

Upvotes: 2

Varun Chib
Varun Chib

Reputation: 11

If everything fails then you can do this :

1: Connect your android.

2: Open cmd and type

adb reverse tcp:19000 tcp:19000

3: Now

npx expo start

4: Enter this in the expo url manually of your android instead your ip.

exp://127.0.0.1:19000

Explanation:

The adb reverse command is used to set up reverse port forwarding from the device/emulator to the host machine.

In this specific case, the command adb

reverse tcp:19000 tcp:19000 

forwards traffic from port 19000 on the device/emulator to port 19000 on the host machine. This is commonly used when developing mobile applications to allow communication between a mobile device/emulator and a local development server running on the host machine.

So, if there is a service running on port 19000 on the device, this command will forward that traffic to the same port on the host machine, allowing the service to be accessed from the host machine as if it were running locally.

Upvotes: 0

Teddy Bersentes
Teddy Bersentes

Reputation: 196

If you are on Mac OS, this fixed it for me:

System Preferences > Network > Wifi

Uncheck "Limit IP Address Tracking".

enter image description here

This might have to do with iCloud Private Relay blocking your Mac from being seen by other devices.

Upvotes: 1

ashish pandey
ashish pandey

Reputation: 1693

Change connection from LAN to tunnel.

screenshot of what to change

Upvotes: 106

Andres R. Bucheli
Andres R. Bucheli

Reputation: 149

The only that I had to do to make it work was to connect the phone and my computer to the same network (before I was connected to two different service providers, I mean at home my laptop was connected to my home internet and my phone was connected to my mobile internet service). I decided to just use the samea connection and it worked.

Upvotes: -1

rahulyadav
rahulyadav

Reputation: 73

change LAN to Tunnel to solve this issue

Upvotes: 4

Alex
Alex

Reputation: 553

For Linux Ubuntu 21.10

This is for users, that don't use UFW.

Make sure ufw is inactive, else, execute 'sudo ufw allow 19000'

sudo ufw status

List rules:

sudo iptables -L

This will output on clean Ubuntu like this:

Chain INPUT (policy ACCEPT)
target     prot opt source               destination         

Chain FORWARD (policy ACCEPT)
target     prot opt source               destination         

Chain OUTPUT (policy ACCEPT)
target     prot opt source               destination  

Now allow port 19000 with command:

sudo iptables -A INPUT -p tcp --dport 19000 -j ACCEPT

Make sure that rule added:

sudo iptables -L

Expected output:

Chain INPUT (policy ACCEPT)
target     prot opt source               destination         
ACCEPT     tcp  --  anywhere             anywhere             tcp dpt:19000

Chain FORWARD (policy ACCEPT)
target     prot opt source               destination         

Chain OUTPUT (policy ACCEPT)
target     prot opt source               destination

After restart all rules will be wiped, so we need to install package, that will add rules from a file rules.v4 on each OS boot

sudo apt install iptables-persistent
su root
iptables-save > /etc/iptables/rules.v4

Enjoy! :)

Upvotes: 1

Deepesh Dragoneel
Deepesh Dragoneel

Reputation: 109

I got it by using this command on my ubuntu system:

sudo ufw allow 19000/tcp

and then type this:

sudo ufw allow 19001/tcp

restart vscode and the expo server and then you are good to go!

Upvotes: 1

Savitar 732
Savitar 732

Reputation: 11

i just want to remember this for those who only try to scan the QR Code

You need to connect your phone to your computer using a USB cable the first time you want to launch the app,that will install the app on your device then the expo scan will work, i think all the solution above will work maybe it's just because you didn't connect them first that everything didn't work

just read the docs https://reactnative.dev/docs/running-on-device

Upvotes: 1

user14339485
user14339485

Reputation:

I had the same issue but after some research, I found that this is because your computer has previously connected to multiple adapters. Expo may pick the IP address of one of these. To avoid this

  1. Go to the command prompt and write 'ipconfig'.

  2. Copy the IPv4 Address under Wireless LAN adapter Wi-Fi.

  3. Then wrte the below command.

set REACT_NATIVE_PACKAGER_HOSTNAME=(Your IP here)

Upvotes: 1

Mohamed Raza
Mohamed Raza

Reputation: 953

I found the solution for windows 8 and 10.

official support link - SEE HERE

When you first connect to a Wi-Fi network, you can set it as public or private—depending on the network and what you want to do:

Private network. Use this for networks you trust, such as a network at home or work. When a network is set to private, your PC is discoverable to other devices on the network, and you can use your PC for file and printer sharing.

Public network. Use this for networks you connect to when you’re out and about, such as a Wi-Fi network at a coffee shop. Your PC will be hidden from other devices on the network, and you can’t use your PC for file and printer sharing.

Upvotes: -1

masdren
masdren

Reputation: 37

Starting EXPO using the -- tunnel flag should help: $ expo start --tunnel

Upvotes: 1

user12500983
user12500983

Reputation:

I had the same issue I got this when I cancel the permission window of node js I solved it by going at the directory

  1. On the Start menu, click Run, type WF.msc, and then click OK.
  2. In the Windows Firewall and Advanced Security, in the left panel in Inbound Rules I had two options or rules disabled Node.js Serverside Javascript.

I simply double click and in new window In action, I select allow the connection and save

Upvotes: 1

manoj
manoj

Reputation: 5643

This is due to not open port from your machine.

Linux (Ubuntu)

In Ubuntu Run In terminal

sudo ufw status verbose To view open port if you cannot found 19000 port open then you need to open port using

sudo ufw allow 19000/tcp

and then again run

sudo ufw allow 19001/tcp

to serve http for react native i solve this problem in my ubuntu using this method. I hope this will help you.

Windows

To open a port in the Windows firewall for TCP access On the Start menu, click Run, type WF.msc, and then click OK.

In the Windows Firewall with Advanced Security, in the left pane, right-click Inbound Rules, and then click New Rule in the action pane.

In the Rule Type dialog box, select Port, and then click Next.

In the Protocol and Ports dialog box, select TCP. Select Specific local ports, and then type the port number of the instance of the React port, such as 19000 for the default instance. Click Next.

In the Action dialog box, select Allow the connection, and then click Next.

In the Profile dialog box, select any profiles that describe the computer connection environment when you want to connect to the Database Engine, and then click Next.

In the Name dialog box, type a name and description for this rule, and then click Finish.

Similarly you can open port 19001 too.

Upvotes: 119

Hemant Bharti
Hemant Bharti

Reputation: 126

Change your network settings:

  1. Network and Internet setting
  2. Status
  3. Change connection properties
  4. Checked public option

Upvotes: 0

ayush b
ayush b

Reputation: 99

When i open Expo(Android application) for scanning the QR code i am facing same issue mention exactly same in the image.

Solution 1:- Connect both(your PC and mobile)with same network then scan the QR with expo application.

Solution 2:-Select / change connection type as Tunnel mention in local host development window of your browser then scan the QR with expo application.

I think this will help :)

Upvotes: 2

Anuj sharma
Anuj sharma

Reputation: 11

I had the same issue after npm start script on windows environment. Putting mobile on the same network as my Windows development environment was solved issue.

Upvotes: 1

Ganesh Hegde
Ganesh Hegde

Reputation: 11

It might sound very naive. But just restarting my machine solved this issue.

Upvotes: 0

LekT
LekT

Reputation: 1

If you have tried everything, and still not working for you. Change the Connection to 'Local' instead of 'LAN', it is working perfectly for me. It is not the best solution but does the work.

Upvotes: 0

Sagar Jethi
Sagar Jethi

Reputation: 2711

This error beaus your port it is not open just check port is open or not for ubuntu you can check using the following way

sudo ufw status verbose

enter image description here check 19000 port open then you need it then run following command if port not open

 sudo ufw allow 19000/tcp

enter image description here for other port runs following command

sudo ufw allow 19001/tcp

because http port not you are getting erro. above step solve your problem similar for mac and windows check firewall setting once

Upvotes: 1

Shaswat Rungta
Shaswat Rungta

Reputation: 3805

If you have tried everything the other answers suggest and it still does not work, please also check that your computer and your phone are connected to the same WIFI network. For me this is what wasted an hour.

Upvotes: 2

Nouman Ghaffar
Nouman Ghaffar

Reputation: 3830

In case someone is still looking for the answer. Do the basic thing first, Disable the VirtualBox Host-Only Network first by opening your network configs. This worked for me.

Upvotes: 2

Preetam Keshari Nahak
Preetam Keshari Nahak

Reputation: 15

One of the simplest and 100% working solutions is:

  1. Enable the Mobile Hotspot of your development machine( PC or Desktop ) and connect your Android device with this hotspot.
  2. Goto Control Panel > Network and Internet > Network Connections You will land in here as shown:Network Connections setting
  3. Then set the IP address of Local Area Connection(Your DESKTOP HOTSPOT) to a desired one, say: 192.168.1.69 by right-clicking on the concerned connection and then clicking on properties -> Internet Protocol Version 4(TCP/IPv4) -> Properties. Then set the priority of this connection to be the highest and this is best described here
  4. Then open a command terminal and run:

    set REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.69 (Windows)
    REACT_NATIVE_PACKAGER_HOSTNAME=192.168.1.69 (Mac & Linux)
    
  5. Then restart your expo server by running npm start in your expo project folder and run the app on your Android device by scanning the generated QR code with the expo app.

Upvotes: 1

Moein Fazeli
Moein Fazeli

Reputation: 191

In my case, this problem occurred because Expo android app need "draw over other apps" permission and I didn't give it. So I give this permission to Expo app and the problem solved..

Upvotes: 1

user3109814
user3109814

Reputation: 1

You Just need to open the port in Window Firewall and everything should work.

1.On the Start menu, click Run, type WF.msc, and then click OK.

In the Windows Firewall with Advanced Security, in the left pane, right-click Inbound Rules, and then click New Rule in the action pane.

In the Rule Type dialog box, select Port, and then click Next.

In the Protocol and Ports dialog box, select TCP. Select Specific local ports, and then type the port number of the instance of the React port, such as 19000 for the default instance. Click Next.

In the Action dialog box, select Allow the connection, and then click Next.

In the Profile dialog box, select any profiles that describe the computer connection environment when you want to connect to the Database Engine, and then click Next.

In the Name dialog box, type a name and description for this rule, and then click Finish.

Similarly you can open port 19001 too.

Upvotes: 0

I've had the same issue. The problem is that the command yarn start or npm start finds the first enabled network adapter it finds which just happens to be the adapter for VirtualBox on my (and many other machines). The solution is to either:

manually set REACT_NATIVE_PACKAGER_HOSTNAME environment variable, or disable the unused network adapter in Windows' Network Connection (see image) The problem is that Expo finds the first Network adapter, and not the active network adapter that provides the internet connection.

enter image description here

Upvotes: 3

Ali Tavana
Ali Tavana

Reputation: 379

I tried many solutions, only this way helped me to solve this problem:

In Windows:

  • go to "Network and Connections" in Control Panel of windows (Network and Sharing Center>Change Adapter Setting)
  • Disable all virtual boxes which you can see here
  • Restart npm or yarn or expo...

Upvotes: 1

Ragulan
Ragulan

Reputation: 1711

in Windows

  1. run the ipconfig in command prompt

  2. get the ip4 address and copy it.

Than go to

  1. This PC > properties > advanced system settings > environment variables
  2. add the following system variable: REACT_NATIVE_PACKAGER_HOSTNAME
  3. As the value for the variable I had to paste the ip4.

then run the npm start It's work for me

Upvotes: 3

Related Questions