React-native iOS: Could not connect to development server - ios

After restarting Wi-Fi router my local ip has changed from "192.168.1.4" to "192.168.1.3" so I've changed it in AppDelegate.m to
"http://192.168.1.3:8081/index.bundle?platform=ios&dev=true&minify=false"
But I still get error on real device:
Could not connect to development server ...
URL http://192.168.1.3:8081/index.bundle?platform=ios&dev=true&minify=false
When I shake my phone and configure bundler to the same IP 192.168.1.3 and port 8081 app loads successfully. But Fast Refresh is not working and I need to build app and configure bundler every time I make changes in my code.
I also checked "http://192.168.1.3:8081/index.bundle?platform=ios&dev=true&minify=false" in my browser and on another computer in my local network and it works fine. Tried to load the same link on mobile browser with no success.
All devices are using the same network.
I have already tried:
cleaned tmp folders and watchman
cleaned iOS build folder
removed and reinstalled node_modules and pods
killed node process and restarted npm with --reset-cache
restarted xcode, iphone and computer (many times)
reinstalled watchman
set "Connect via Network" in Xcode Devices window

That was issue with expo-splash-screen package which doesn't work on new iOS version. The fact that app was not able to run after wifi restart was just a coincidence. I have seen some non-permanent warnings about splashscreen in Xcode logs but didn't take it seriously.
Removed 'expo-splash-screen' package and everything works fine.
It helped me a lot: https://github.com/facebook/react-native/issues/31369

Related

ReactNative access denied when Mac is connected to VPN

Launching application ReactNative on a ios simulator gives erros when Mac is connected to VPN :
Access Denied (policy_denied)
On device it's work fine, if a disable VPN it's works
I tried to delete all folded nodes_module, pods, ,lock files launch several times but still the same problem
I launch the app from xCode i also try to launch it from terminal but nothing changed
Any help will be appreciated
On simulator i click on
cmd + d
configure bundle
after i put the ip adress of my Mac adress 192.168... and it works

React Native iOS could not connect to development server

I get the common Could not connect to development server error described in e.g. React-native iOS: Could not connect to development server. Things that are working:
My iOS device is built fine using Xcode and launching
The URL inside the app shows correctly (192.168.4.59:8082/index.bundle?platform=iOS&dev=true) and opening that URL in the browser loads the bundle as it should
The phone and laptop are on the same wifi
Killed node process and restarted npm with --reset-cache
Restarted xcode, iphone and computer (many times)
What might I be doing wrong?
It worked to use a USB cable instead of wifi and untick "Connect via Network" in Xcode > Devices And Simulators window.

Could not connect to development server - React Native

I am creating an app using react native. I tried to change a file path to an image within my code and when I ran my app on the iOS emulator the following message was displayed.
I have tried a number of different methods such as closing the terminal and running the app again.
I also tried running localhost:8081 in my browser and was given the following message
I have also tried deleting my node_modules folder and running yarn but this still hasn't fixed the problem.
Any ideas as to how I would fix this?
You can try to clean xcode, remove app in the simulator
cd ios
xcodebuild clean
run bundler
react-native start --reset-cache
Replace the actual IP Address with the "localhost" in the Url and that should fix the issue if the url is proper.
Fully delete the app on the iOS Simulator, then rebuild the app from xcode.

Expo React Native App Not Loading the AppEntry.bundle

I am working on a react-native app using expo. The app was working just fine. I could do npm start to run the metro builder and then run my app on simulator as well as iOS devices directly.
I did 2 things.
I upgraded the expo version to latest - 3.17.15
I rebooted my laptop.
After these 2 changes, I could still do npm start without any issues. But, when I tried to open/ run the app in iOS simulator it got stuck at the bundle loading. In fact it could not get the bundle file only.
I thought this was a network problem where the simulator/ device was not able to reach http://127.0.0.1:19000 However, when I visited the url in the browser that was working.
The bunlde url that I saw in the error:
Now, when I try to visit that bundle url through the simulator:
http://127.0.0.1/node_modules/expo/AppEntry.bundle
The browser never loads the thing and times out.
I have already tried:
Cleaning the cache - npm start --reset-cache
Deleting the .expo folders in ~/.expo as well as ~/project/.expo
Changing the mode from Lan -> Tunnel.
Upgrading the global expo-cli to latest version.
removing the node_modules directory in the project ~/project/node_modules
re installing the node_modules by doing - npm install.
IMPORTANT - After having this issue with my current app, I decided to spawn a new blank expo app and run the same. Same result. The bundle was not loaded. I also remember something like this happening to me in the past but don't remember how I fixed it.
My Network is a hotspot through my phone. The same network used to work until yesterday without any issues. So not sure if reboot has caused some setting to revert.
Any help troubleshooting this problem would be very helpful here.
Finally after spending 2 days and working on 2 different laptops I could get to the root of this problem.
Firstly, I thought this was an OS upgrade issue (I upgraded my OS to Mac OS Catalina). So, I cloned my repo on another laptop, a fresh one where these was no node expo or react native. I initialized a new expo typescript react native project. Tried to run it - Worked like a charm. Simulator was not installed but worked on my device without any issues. The metro bundle log was generated.
This was leading me even closer to my assumption. So I tried to revert all the changes I had in my repo and tried building the app with npm start which eventually runs expo start. Did not work.
Finally - I created a fresher user on my laptop. The upgraded one. Cloned the repo - and tried to build the project. This time! Again it failed, however there was one change - in the metro builder log I got a this error:
2020-04-06T21:29:57,075: [0x110e7fdc0] while computing sockname: failed to create /usr/local/var/run/watchman/shrikant-state: Permission denied
Watchman: watchman --no-pretty get-sockname returned with exit code=1, signal=null, stderr= 2020-04-06T21:29:57,075: [0x110e7fdc0] while computing sockname: failed to create /usr/local/var/run/watchman/shrikant-state: Permission denied
To solve that I just changed the permission to the watchman directory:
sudo chmod 042777 /usr/local/var/run/watchman/
The app was finally built and running successfully on both the simulator and the device!
If anyone else runs into something similar, I was stuck on this and it turned out expo didn't like me using a logical OR assignment ( ||= ) even though typescript and my linters were fine with it. I replaced my ||= with a ternary and worked fine.

React Native on Ipad - Error - could not connect to development server

I'm using React-Native, when I run the AwesomeProject with Xcode and iPhone simulator everything works well, but when I connected my iPad and built the project on my iPad I receive an error on the iPad when the app starts:
"Could not connect to development server. Ensure node server is
running. The operation couldn't be completed (NSURLErrorDomain error
-1004)".
I also ensured that the node package is running. I even restarted Xcode and started it all over with running npm start.
Could you please assist?
On your AppDelegate.m you have to update the jsCodeLocation and replace localhost with your machine ip address.
Either that or bundle the compiled source into your application, which is commented as option 2 on AppDelegate.m as well. You download the compiled code, and add it to your Xcode project.
Try to take a look here for the solution:
https://github.com/facebook/react-native/issues/240#issuecomment-86977126
Another potential issue which can cause the exact same error is App Transport Security (ATS) in iOS9--this happened to me, even though everything else was set up correctly. See my description and solution at https://stackoverflow.com/a/34880394/2397068.
I have prepared a small instruction which will help to solve this problem.
When your application cannot connect to the server, you will see the message like this:
Open a file AppDelegate.m in your Xcode project and look for
jsCodeLocation = [NSURL URLWithString:#"http://localhost:8081/index.ios.bundle?platform=ios&dev=true"];
You have to replace this address with your local address.
To look up your local IP address in Mac OS X open Terminal application (located in /Applications/Utilities) and type ipconfig getifaddr en1 for wireless, or ipconfig getifaddr en0 for ethernet.
You can check It in browser. And you will see React Native Debugger page
Just replace localhost in AppDelegate.m with your IP address. localhost to 192.168.1.100 in my case.
Run your application in Xcode again.
In my case, I just had a very old version of node.js installed (version 0.8.6). After updating node.js to version 0.12.2, the default project that react-native init AwesomeProject created worked perfectly.

Resources