Kasun Randika Kasun Randika - 2 years ago 141
PHP Question

Android App can't access Vagrant Homestead hosted Web API


I'm new to Laravel, Vagrant-Homestead setup, and Android's networking library Retrofit. But I'm good in Android and PHP Web development. However I setup Laravel, developed a simple test web API, just to test Retrofit library in Android App. And also please don't mark this as a Duplicate Question of the following Q&A thread. Even though it asks the same alike question, these questions are different.

My Problem:

My Vagrant-Homestead hosted web API I can access through the web browser installed in host OS X Mac. And also my Homestead has two Laravel sites ll5.app and tapi.app (which is the API).

_____________Mac OS X on MB Pro___________________
| _______________ ______________ |
| | Vagrant | | | |
| |http://api.app | <------> | Web Browser | | IP:
| |_______________| |______________| |

But, I still couldn't fix this up for the following:

_____________Mac OS X on MB Pro_______________________
| __________________ ________________ |
| | Vagrant | | | |
| |http://api.app | <---X--> | Android App | |
| | IP: | |IP: | |
| |__________________| |________________| |

My Host file looks like follows: localhost broadcasthost
::1 localhost ll5.app tapi.app

And following is just a part of my

- map: "/Users/randika/Private_Projects/webapps/"
to: "/home/vagrant/webapps"

- map: tapi.app
to: "/home/vagrant/webapps/test_api/public"
- map: ll5.app
to: "/home/vagrant/webapps/ll5/public"

I tried giving following things to try out a web service call using Retrofit library.

Retrofit retrofit = new Retrofit.Builder()

For the <address> I tried giving following values:

When I try to access the this using Genymotion Android's Web Browser and the address as, it loads the ll5.app home page not the API.

How to resolve this problem? Any help is appreciated.

At least just tell me that this can't be done?

P.S.: It's already 1+ AM in the morning and I've been struggling with this from the last weekend!

Answer Source

I had not to give up this problem and resolve it once and for all. Because I'm fed up with going to find web hosts whenever I need to host something and publicly share it among my colleagues.

Answer Skeleton: This includes you following things:

Must To-Do things:

  • Modifying your hosts file
  • Modifying Nginx files inside vagrant

Optional To-Do things:

  • Create an Atlas Account and use vagrant share feature to share to access to access your Vagrant-Homestead Laravel development app anywhere in the world over the Internet.

Answer Step by Step:

1. Intro about my Mac + Vagrant + Homestead environment.

My Host MacBook current IP Address:

My Vagrant-Homestead IP Defined within the Homestead.yaml:

I have told before within my Question, I have multiple sites (ll5.app and tapi.app). So following is part of my Homestead.yaml which has mapped those multiple sites.

     - map: "/Users/randika/Private_Projects/webapps/"
       to: "/home/vagrant/webapps"

     - map: tapi.app
       to: "/home/vagrant/webapps/test_api/public"
     - map: ll5.app
       to: "/home/vagrant/webapps/ll5/public"

Ok, now we are good to go to the second step. Sorry above portion of Hosts file is not code-formatted due to an editor bug.

2. I modified my hosts file as follows:

Note that I've mapped my current IP address with the Vagrant IP address.       localhost broadcasthost
::1             localhost   tapi.app   ll5.app

And save it.

3. Start your vagrant and provision.

 cd Homestead/<br/>
 vagrant up<br/>
 vagrant provision<br/>

4. And let's go to edit our Nginx files inside the vagrant. Login to vagrant via ssh.

 vagrant ssh

You should see a vagrant ssh prompt like follows: vagrant@homestead:~$

5. Now let's go eddit our Nginx configuration files for each of our provisioned Vagrant hosted web apps.

 cd /etc/nginx/sites-available<br/>

You would see the list of web app config as follows(according to my setup):

 ll5.app  tapi.app

Out of those two web apps I wanted to access tapi.app via the Android Genymotion, but even though when I give Vagrants VirtualBox IP or Vagrant IP addresses it was not available to access because I have multiple sites hosted in vagrant homestead. If it is a single site setup then I's able to access via the Vagrant IP Address.

Get your required App related Nginx Config file as follow: (this step assumes that you know the very basics of Vim editor).

 sudo vim tapi.app     ----> This will give you the chances to edit that NginX config file.

It was like following:

server {
  listen 80;
  listen 443;
  server_name tapi.app;
  root "/home/vagrant/webapps/test_api/public";

And change it to look like following:

server {
  listen 80 default_server;
  listen 443 default ssl;
  server_name tapi.app;
  root "/home/vagrant/webapps/test_api/public";

I hope that you noticed the following two lines:

 listen 80;    to    listen 80 default_server;
 listen 443;   to    listen 443 default ssl;

Ok, and now save the Nginx Config file and quit from Vim editor.

6. Now the final essential command, to be executed within the vagrant ssh:

sudo service nginx reload

If you have followed the above steps up to the last one, then now you might have got the answer to your question (I've got the answer for my question after trying to resolve this for the past 5 nights with lesser sleep hours :D ).


Please keep in mind that, we edited the Nginx Config file just to make one of our site to be served by default via the server, so these steps were carried out just because we have multiple sites within our Vagrant-Homestead box. So after we are done with what we wanted, we should rollback the changes we did to that particular Nginx Config file the same way we accessed it via Vagrant SSH. Else if you keep this change as it is your other sites won't be working well as they were. For further readings please read the following thread.

Optional To-Do things:

  • Let's say that you want one of your projects (web API or web app) developed under Vagrant-Homestead, and you want to share it with your colleagues over the internet? And you have another bunch of sites in it too (that's why we struggled above steps). So that's also possible which we call (vagrant share). So I have edited the Nginx file and informed the server that which site do I need to serve as the default one, so by doing Vagrant share, this will now serve that site via the Shared URL. So let's start doing it:

Visit this link just to get some background idea about what we are gonna do.

Vagrant Share Steps:

  1. Visit the following link and create your Atlas Account.
  2. Exit from Vagrant ssh just by typing exit, and inside the Homestead directory, login to vagrant like follow:

    vagrant login

  3. Give your Atlas Account details (username and password) respectively when it prompts to you.

  4. Final step of vagrant share is, vagrant share itself. Do it as follows:

    vagrant share

    And this should give you a result out put like the following, with globally accessible Temporary URL, which lasts until you stop sharing with the Ctrl+C command.

Vagrant Share URL

Hope this answer will be helpful to somebody else and will save few hours of their life time.

Cheers to All The Engineers in this Planet!

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download