0

I am developing a backend with some routes that I want to use in an iOS App (developing the app with Expo and react-native). So during the development mode (both for the backend and for the app), the backend is served on http://127.0.0.1:80/, and it is working perfectly when the app is on the iOS Emulator, but when I start the app on a real device, then I can't connect to the backend using the same url. What url should I use ? Or which setting do I miss ? Here is the code I have for starting the server...

const app = require('./app');
app.set('port', process.env.PORT || 80);
const server = app.listen(app.get('port'), () => {
  console.log(`Express running → PORT ${server.address().port}`);
});
arnaudambro
  • 2,403
  • 3
  • 25
  • 51

2 Answers2

1

Localhost won't work if you have two different devices. Instead try to connect both to the same wifi network and use the ipv4 adress of you pc (find with ipconfig in cmd) instead of '127.0.0.1'. Provided that your firewall doesn't block the connection.

Mukeyii
  • 520
  • 3
  • 13
  • how can I tell express to use my ipv4 instead of 127.0.0.1 or localhost ? because I just tried : let say my ipv4 is 123.456.789.10, I wanted to access `http://123.456.789.10:80/` but it doesn't exist... – arnaudambro Jan 29 '19 at 16:43
  • 1
    Check this out: https://stackoverflow.com/questions/9682262/how-do-i-connect-to-this-localhost-from-another-computer-on-the-same-network – Mukeyii Jan 30 '19 at 08:22
  • thanks, the article http://egalo.com/2012/05/29/testing-mac-web-site-using-local-hostname-on-mobile-device/ helped a lot in my case actually ! I'll write the detailed answer down in case anybody comes here looking for a quick solution – arnaudambro Jan 30 '19 at 16:04
  • unfortunately, the solution I wrote below is not working for me : I work on a react-native project with Expo, and it is using my computer IP already (with port 19000) to launch the app on my iPhone, and if I configure the proxy with the port 80, the back-end is working but not the expo app anymore... – arnaudambro Jan 30 '19 at 16:38
0

So thanks to @Mukeyii I found the answer (for a Mac and an iPhone at least) on this page

Here are the steps :

  1. On your Node app, you need to give the port and the ip you'll be listening the app, for example :
const app = require('./app'); // app is made with express.js
app.set('port', 80);
const server = app.listen(app.get('port'), '0.0.0.0', () => {
  console.log(`Express running → PORT ${server.address().port}`);
});

Strangely, I wanted to put the 127.0.0.1 ip but it didn't work. 0.0.0.0 worked for me so I put that one.

  1. On the /private/etc/hosts file, add the line 0.0.0.0 any.url.you.wish, save and test on a browser on your computer that when you start your app (dev mode) and you type the url any.url.you.wish, you go on your app.

  2. Download SquidMan and open it, let it install what it wants to install.

  3. In SquidMan > Preferences, set the port in the General tab (for me: 80)

  4. On the Client tab, set a new ip: the ip address of the iOS mobile device. To get it, you need to click on the i in front of your WiFi connected network.

  5. On the Template tab, add a comment on the line http_access deny to_localhost and add these two lines :

# hosts file
hosts_file /private/etc/hosts
  1. Save the Preferences and Start Squid
  2. Get the IP Address of the Mac in System Preferences > Network
  3. Configure the Proxy on the iPhone (port + ip) at the bottom of the same view described in 5.

That's it ! Read more infos in this url: http://egalo.com/2012/05/29/testing-mac-web-site-using-local-hostname-on-mobile-device/

arnaudambro
  • 2,403
  • 3
  • 25
  • 51