This tutorial will show you how to access a localhost server from an iPhone if you’re using a Mac. I used this to access a Ruby on Rails app from my iPhone, but you could just as well be building with Node, Jekyll, Gatsby, or anything else. Just make sure you have an iPhone and a Mac. Let’s get started.
Connecting iPhone to localhost
- Connect your iPhone to your computer via USB.
- Open System Preferences > Sharing.
- Select Internet Sharing in the left tab. This should show your internet sharing controls on the right.
- If the checkbox next to Internet Sharing is enabled, uncheck it.
- On the right side of your Internet Sharing options, check iPhone USB.
- Enable Internet Sharing by checking its checkbox. There may be a popup that asks you to confirm this action.
- Find the message near the top that says, “Computers on your local network can access your computer at:
xxxx.local. Make a note of what
xxxxsays – this is your computer’s name. You’ll be typing it into your address bar, so I recommend editing it into a short word.
- Depending on your server settings, you might now be able to access your localhost server from
xxxxis your name from the previous step and
yyyyis your server’s port number. For instance,
myname.local:3000. However, I needed to do one more thing before I could connect to my local server.
- I was trying to develop a Rails app, which meant that I needed to explicitly binding the IP when running the server command. I solved this by running my server command with a binding flag:
rails s -b 0.0.0.0. Then I could connect to
myname.local:3000to run my app. If you’re not running Rails, you may want to review your framework’s documentation to see how to bind the server to an IP.
Now you should be able to access your localhost server from your iPhone. You can also access additional debugging tools with Safari:
Enabling mobile debugging tools
- Inside your iPhone’s Settings app, go to Safari > Advanced and enable Web Inspector.
- On your computer, open Safari > Preferences > Advanced and enable Show Develop menu in menu bar.
- Still on your computer, make sure Safari is in focus, and open the Develop menu (found on the menu bar running along the top of your Mac’s screen). Open this menu, select your phone’s name, and choose Connect via network.
- On your phone, open Safari and navigate to your localhost app.
- On your computer, open Safari’s Develop > PhoneName menu and select the correct tab to open a live debugger on your computer.
Congratulations! You can now access localhost via your iPhone, and you have some nice debugging tools as well.