Stop exp from switching to LAN URL when tunneling - react-native

When trying to run exp start --tunnel in a react-native project, I often see the warning:
22:15:31 [exp] Your URL is: exp://192.168.200.83:19000
....
22:15:31 [exp] Switched to a LAN URL because the tunnel appears to be down. Only devices in the same network can access the app. Restart with exp start --tunnel to try reconnecting.
This is a problem since none of my devices or the AVD can connect to this URL to download the project.
The problem does not seem to related to any firewall settings as it does not occur every time (just very consistently). When the error does not happen, I get a URL that I can work with that looks like:
22:44:38 [exp] Your URL is: exp://en-ux3.myexpousername.myapp.exp.direct:80
Is there something that can be done about this to get it to stop switching? What causes this switching exactly? Is there some way to get devices to be able to use this URL instead (I have an android device connected to same wifi, but seems to be unable to download the project from the LAN URL)?
** Totally new to react-native and expo, so if I am missing evidence of any common debugging steps for this kind of problem, please let me know what they may be in the comments so I can update the question.
UPDATE:
A similar question to this is addressed in the expo forums: https://forums.expo.io/t/switched-to-a-lan-url-because-the-tunnel-appears-to-be-down-only-devices-in-the-same-network-can-access-the-app-you-can-restart-the-project-to-try-reconnecting/4483.

I was having the message
Switched to a LAN URL because the tunnel appears to be down. Only devices in the same network can access the app. You can restart the project to try reconnecting.
And I've solved it closing Visual Studio (then pressing the Restart button from Expo XDE)

Related

React Native - expo go not able to connect

I'm very new to React Native and I'm understanding now Ports and similar things. In the last days I was able to access through Expo Go my app, but starting from today I ran into issues.
I think the problem was, that I was accessing the app using an university wi-fi connection, while the other days I used a mobile data connection. With Wi-Fi I was not able to access the app. The error log said: java.net.connectException: failed to connect to (...)
So I started a big journey thorugh ports, ip addresses and firewall, arriving to the ubuntu's ufw. Actually I don't know exactly what I've done, but the last try was to disable everything (like it was at the beginning) and retrying to access the app, nothing changed. The error log was: java.net.SocketTimoutException: failed to connect to (...) from (...)
I tried also use tunnel (like this question says Unable to connect to Expo React Native Project on WSL2 with Expo Go on phone) but it didn't help. In this case, the app says New update avalable: downloading... but never ends.
So, any suggestion to understand a) which is the real problem (a part that I've done something that I didn't understand) and b) how to solve it ?

Expo tunnel not working (invalid certificate)

I'd like to use expo start --tunnel to allow connecting to the App over the internet.
However, right after starting, the DevTools open and show me the following error:
Error loading DevTools
ValidationError: "urlType" must be one of [exp, http, redirect, no-protocol]
The console shows me:
Starting Metro Bundler.
Tunnel URL not found (it might not be ready yet), falling back to LAN URL.
Tunnel URL not found (it might not be ready yet), falling back to LAN URL.
So far so bad.. I've then looked into the .expo/packager-info.json to see what URLs have been generated. The file looks like this:
{
"devToolsPort": 19002,
"expoServerPort": 19000,
"packagerPort": 19001,
"packagerPid": 7316,
"expoServerNgrokUrl": "https://sz-p2a.anonymous.123.exp.direct",
"packagerNgrokUrl": "https://packager.sz-p2a.anonymous.123.exp.direct",
"ngrokPid": 5316,
"webpackServerPort": null
}
Then I've tried to open these URLs on the target devices. When doing so, I get an SSLPeerUnverifiedException because of an invalid certificate. I think it's the same error that I get when navigating to the URL directly in the browser.
So, am I doing anything wrong or is the tunnel workflow broken right now?
What might I do to get it working?
I somehow bypassed this problem by removing https from the link.
To do so, take the expoServerNgrokUrl from .expo/packager-info.json and turn:
https://sz-p2a.anonymous.123.exp.direct
into
http://sz-p2a.anonymous.123.exp.direct
Then you can send it to any Expo device.
I had the same issue, logged out expo logout, logged in again expo login and it worked.

The Expo SDK requires Expo to run. It appears the native Expo modules are unavailable and this code is not running on Expo. I want to generate apk

I am using expo-cli#3.0.10
This app works fine in client expo which installed in device
Ok I believe I found the core problem - DNS issue.
Your Android simulator cannot properly resolve the hostname using your current DNS for whichever OS you are on be it Mac OS, Windows or Linux.
Follow this link to set your DNS address to 8.8.8.8 or some other applicable DNS.
Once you set your DNS properly it should work.
Make sure that 8.8.8.8 is the first DNS address in the list(?) of DNS addresses so that your system will resolve hostnames using the Google DNS first.
Reposting the useful information from that link below,
Change the DNS address of your network to 8.8.8.8:
MacOSX:
Open "System Preferences"
Click on "Network"
Select the network which your computer is connected and click on "Advanced"
Select "DNS", Select the "+" button, type "8.8.8.8"
Select "Ok" and "Apply"
Windows & Linux:
https://developers.google.com/speed/public-dns/docs/using
After that close the emulator and start it again.
This case happened to me whenever I switch from a network to another without restarting my emulator.
The simplest way to solve this was to restart my emulator.
I hope it helps,
For my case, this error occurred because I changed from LAN to Wireless Internet connection while the project is building.
Solution: Close the Emulator and restart Android Studio. Run the project (either npm start or expo start) and this worked for me.
You need to start expo server first. Use expo start. Then run your project.
After starting your expo server re-start your project.

React Native Debugger prevents network requests

I'm working on a React Native app, testing in an android emulator. I've used the standalone React Native Debugger app as well as the debugger that opens in Chrome. In the Chrome window, the Network tab shows no activity, so that's no help. In the standalone debugger, the same is true until you right-click and choose Enable Network Inspect. The problem I'm having is that after I enable network inspecting in the debugger, all network requests fail - the inspector shows their status going from Pending to Canceled after a few seconds. I can see in my server logs that no requests are coming in. It's like debugger itself is somehow blocking the requests.
I've set up adb to run as root. When I run react-native run-android the output includes Running adb -s emulator-5554 reverse tcp:8081 tcp:8081, so I think things are starting up fine. The network requests from the app (login etc.) work fine (a typical URL would be http://10.0.2.2:2080/api/LoginScreenController/GetIdentityStatus), until I choose "enable network inspect" in the debugger, at which point all network requests fail as described above.
Any suggestions would be appreciated.
I know that I'm too late but perhaps it will save time for somebody.
During the update of the react-native, I did update the version of the react-native-reanimated from v1 => v2, and after it, I faced the same behavior.
Version 2 requires to enable Hermes engine if it won't be enabled then all the requests will be in pending status

Unable to connect Android phone to my project with Expo

I created my project in react native by CLI:
_npm install -g create-react-native-app
_create-react-native-app AwesomeProject
_cd AwesomeProject
_npm start
Then I installed expo in my Android phone, and scanned a QR code on my computer screen.
However, my phone can't connect to project, and I don't know why. It just loads and fails. This is error message:
Could not load exp:// 192.168.56.1:19000. Network response timed out.
This is view error:
"Uncaught Error: java,not.SocketTimeoutException: faild to connect to/192.168.56.1 (port 19000) after 10000 ms.
I'm trying to fix it, but still can't get it working. My phone and my laptop are on the same network. What can I do now?
I had the same problem but solved by running expo start --tunnel
Select LOCAL instead of LAN.
I kicked myself when I fixed this.
I had the same issue, turns out my firewall was blocking my connection to the development server port (for me it was 19000). Solved it by disabling firewall.
Choose Tunnel Instead of LAN or Local in connection tab. This solved the issue for me.
Keep a look on this issue for the answer:
https://github.com/react-community/create-react-native-app/issues/60
Make sure that your device and computer are one same LAN/Wifi. It will work.
Also use LAN option.
check open port using
ufw status verbose
And if you don't see the port You are working on
for example 19000 => expo
try this
ufw allow 19000
I've had a similar problem on iOS - the project showed up in the Expo app but didn't want to connect.
Here's what I did:
Connect your PC to your device through USB cable
Download the newest xde from: https://github.com/expo/xde/releases
Install XDE, create a new project from the gui (do NOT use your old project from create-react-app, as it may also show up in XDE) and click the newly created (in XDE) project under "My Projects".
Now your project should show up in the Expo app on your phone. If it doesn't try sending yourself the link to your app over email (to your own inbox, and open the link on your phone), mine looks like this: exp://5c-gp9.[accountname].my-new-project.exp.direct:80
I had this problem when my phone was connected via wifi and my destop was connected via LAN. I changed the connection mode in the browser window to tunnel, reloaded the expo app and was able to connect to my application. This was on my iOS device.
I got this issue on Win 10 with android and solved by the adding a firewall rule for my device (device IP as remote). I was using ESET NOD antivirus and it was block the device from accessing node.exe
for local testing e.g comnputer , simulator
expo start
for Real mobile device
expo start --tunnel
I'm on windows 10.
My network was set to public, but it needed to be private - so that it could safely expose devices like printers and in this case the Expo connection.
I went in my Wifi setting and clicked on Private:
If you are using windows 10 do the following. It worked for me
1. Check if your phone and pc are sharing the same router/hotspot/wifi connection. better still you can connect your pc to your phone hotspot.
2. Configure the network you are using as private. you can do so using this link https://www.digitalcitizen.life/how-set-your-networks-location-private-or-public-windows-10/
3. Off your windows defender and any other antivirus. The windows and other antivirus defender acts as a firewall and prevents expo client from working.
It will work I assure you
I was having the same issue, the solution is easy just make a Firewall rule that allows connection from your mobile device to your PC. open port number 19000 and in the IP put your phone IP address then allow the connection TCP/UDP in both directions, and everything will be OK.
Usually, you can edit the Firewall rules through your antivirus installed on your PC.
Careful don't disable your firewall, it will hurt you a lot.
This problem is due to the sdk version of the project is not compatible with the expo go ,so go to app.json of your project and edit to the latest version of sdk