How to get port forwarding to work with gatsby and vagrant or virtualbox

4
votes

When using Gatsby running on Vagrant (over Virtualbox) I cannot get the port forwarding to work.

Gatsby by default runs on localhost port 8000.

My Vagrantfile seems to forward the correct ports using the following:

config.vm.network "forwarded_port", guest: 8000, host: 8000

When I start Gatsby on the Vagrant box using yarn develop, everything looks ok on the guest box and the app is running on localhost:8000

info bootstrap finished - 7.354 s

 DONE  Compiled successfully in 9091ms                                                                                                                                                                                                

You can now view foo-bar-org in the browser.

  http://localhost:8000/

I can run curl http://localhost:8000 on the guest box to verify that it is indeed serving up content locally.

Back over on the host box when I go into the browser and try to access http://localhost:8000 it says "Localhost refused to connect".

Running netstat -tulnp | grep 8000 on the guest box I get the following:

tcp        0      0 127.0.0.1:8000          0.0.0.0:*               LISTEN      1909/node

And running the same on the host box I get this output:

tcp        0      0 0.0.0.0:8000            0.0.0.0:*               LISTEN      13827/VBoxHeadless
1
javascriptreactjsvagrantvirtualboxgatsby

1 Answers

9
votes

I did get this working by changing the way I run Gatsby on the guest box. It seems like gatsby develop -H 0.0.0.0 will get Gatsby listening on connections from all hosts. The netstat -tulnp | grep 8000 output then changes to:

tcp        0      0 0.0.0.0:8000            0.0.0.0:*               LISTEN      2348/node

I'm answering my own question in case it helps someone else, but if someone can come up with a better way of doing this with Gatsby still listening just on localhost then I would prefer that answer and will accept that answer.