Testing local site on mobile

I’m running DevKinsta on my Windows 10 machine and I can test the site on this machine itself via the browser running on Windows 10.
Now, I would like to test the site also using my mobile phone which is connected to the same private network.
I had a look at Share Project with my network and the Docker resources mentioned therein, but wasn’t able to figure it out so far.

What I did notice is that when I enter my Windows 10 machine’s local network IP address directly in my browser running on this Windows 10 machine, then the website that I’m working on is loading in the browser on this ip. So I can open the site using “http://mylocalnetworkipaddress/” on this machine.
I thought this might mean it shouldn’t be too hard to “port” this access to other devices on the network?

As the support topic mentioned above is now quite old already and there are no further updates yet regarding adding such functionality in DevKinsta itself, @michael do your developers have perhaps a few simple workaround config steps that would make the site available, at least for testing, on other devices in the local network?

Hi @GoldyOnline ! I’m afraid we don’t have an easy process for this at the moment. I can see why this would be useful though. It’s certainly possible, but would require some tweaking with Docker that we don’t have a guide that we could provide for. I highly recommend contributing to this feature request though!

Thanks for the reply @michael

I had another look and actually realized that it’s already possible with the current version of DevKinsta/Docker, no changes to Docker config required, at least not in my case (Windows 10 Pro and Hyper-V). I’ll share what I’m doing now for reference below. However, I’ll still contribute to the feature request you mentioned as well.

  1. I noticed that the site opens using the local network IP of the machine that DevKinsta is running on. On that machine the site loads just fine using: http://mylocalnetworkipaddress/
  2. When trying that same IP from another device in the local network the website would not load. However, that is just because it tries to load resources (in the html source) using the domain configured in Wordpress as the site domain, which would be something like: mylocaldomain.local
  3. If the other device you want to open the website from is a Windows PC or laptop, the solution is simple: just add an entry in the Windows “hosts file” which points mylocaldomain.local to the local IP address of the machine which runs DevKinsta , see for example https://www.howtogeek.com/howto/27350/beginner-geek-how-to-edit-your-hosts-file/
    After that you can open the site using the local domain, no need to open the site using the IP address.
  4. If you want to open the site from mobile, in my case an iPhone, it’s more difficult as there is no such thing as a hosts file you can edit on IOS, at least not that I’m aware of.
    4a. One possible way to fix this would be to change the domain of the site in the Wordpress settings to the local IP address of the machine which runs DevKinsta. I believe that should work as then there is no domain name anymore that can’t be resolved. However, I haven’t tested this solution as I went with 4b below.
    4b. Use a solution that replaces, in the final HTML output, the local domain with the development machine’s IP address. This allows for the site to be opened using the dev machine’s IP. See WordPress filter to modify final html output - Stack Overflow for some possible solutions. I happen to use WP Rocket, so for me the below code in functions.php works. The only conflict I found so far is that Imagify doesn’t insert tags anymore after this but that is a limitation I can live with for testing purposes. Of course, other issues may result with other plugins.
if ( $_SERVER['HTTP_HOST'] == 'devmachineip' ) {
	add_filter('rocket_buffer', function($output) {
		return str_replace('mylocaldomain.local', 'devmachineip', $output); 
	});
}

I suppose there are better, and perhaps less complicated, ways to get around the issue that the local domain doesn’t resolve on IOS but I didn’t look further as the above is good enough for me. If anyone has a better/easier solution though, feel free to share it!

Also, I should add that the above solution doesn’t control which of the local sites is loaded when accessing by entering the dev machine’s IP directly into the browser. I have 2 local sites and the one that I’ve added last is the one that comes up, which happens to be the one I need:) I assume this is controlled via nginx and it may require a change there if you need a different site to come up in case you have more than one.

1 Like

Additional solution for resolving the domain on mobile:
Add the domain and the IP of the dev machine to your router’s “LAN DNS” (or similar) settings. If your router supports this and you configure it correctly, all devices in your network should then resolve the local domain to the correct IP of the dev machine, without any need to edit hosts files or open the site by IP etc.
On IOS then still had an issue with the .local domain as IOS has issues with that in general. A solution that works so far for me can be found in this older topic iphone - Cannot access .local addresses from my iOS devices - Ask Different , new answer added at the bottom. There are also other potential solutions for the IOS .local issue in this topic.

Hello @GoldyOnline,
unfortunately i am having a big problem with devKinsta, since i updated it no longer reads the databases of my projects and i almost certainly lost everything … they are trying to help me, but i think there is nothing to be done.

In any case the solution you have provided seems good, for sharing in the local network on other computers, clearly not for mobile.

But try to explain in detail how you go about sharing to other users on the local network.
I entered the .local domain that I created on the main Mac computer in the hosts file of my Macs, but the site is not reached.

@WoodyP sorry to hear it! I hope it works out.

Regarding how I managed to share on the local network: that is the thing, I didn’t do all that much. My Docker / DevKinsta setup is rather standard (as it comes). What I did do is switch to using Hyper-V instead of WSL2, see Website Interactivity is Slow - #39 by GoldyOnline , but that was for another reason and I have no idea whether it affects the ability to share on the network. My dev machine running DevKinsta is Windows 10 Pro, I didn’t make any config change on the machine to make it work.
I’m pretty sure that in some cases firewall rules on the dev machine would need to be edited to allow the incoming connections on port 80 and/or 443, and there could be other “network sharing settings” on the dev machine that need to be set correctly (in my case under Windows the dev machine is set as discoverable in the local network) but in my case I didn’t change anything, it was working by default, I only fixed the issue of the domain not resolving on other devices in the network. You mention using a Mac, I suppose the situation could be different for a Mac, I have no idea about that.

For mobile, the hosts files are indeed not a solution but the LAN DNS solution in the router config mentioned above definitely solved the problem for me for mobile (IOS) and iPad, that works fine now too for me, the .local domain resolves just fine now on IOS and I can test my site.