Hi guys! Today, I come here with another mini-tutorial to make programming on Windows a little easier with the help of the . You can check . WSL 2 previous articles here Imagine you are developing an API,  web app, website, etc. on your Windows machine under WSL2. For example, in my case, . I use the React framework , and yarn as package manager, so if I want to start the development server to check my site I just do: my own website Next.js yarn dev With the above command, the development server will start and listen on port . It will serve the page to every device that can reach it, as it's serving the site on the address by default. 3000 0.0.0.0 Then, if I visit on my Windows machine, everything works. The server returns my live website. However, what happens when I try to open my live site from my mobile phone? I navigate to and then localhost:3000 <my_windows_local_ip>:3000 The solution: forwarding ports in WSL 2 NAT WSL 2 creates a , so in fact it creates a NAT between your WSL instance and your Windows host computer. So to be able to access to applications running in your WSL from within your Local Area Network (LAN), you must port forward the desired ports. virtualized Ethernet adapter with its own unique IP address The solution is to add a port proxy in the Windows Firewall, so we open a PowerShell terminal with administrator rights and execute the following command: netsh interface portproxy add v4tov4 listenport=3000 listenaddress=0.0.0.0 connectport=3000 connectaddress=<the_wsl_ip> You can get the WSL virtual machine IP right from PowerShell, by executing bash: bash.exe -c "ip -4 addr show eth0 | grep -oP '(?<=inet\s)\d+(\.\d+){3}'" Or the same from within the WSL instance: ip -4 addr show eth0 | grep -oP '(?<=inet\s)\d+(\.\d+){3}' After executing the command in an administrator PowerShell, the server can now be reached without further configuration needed, nor restarting the server. netsh interface Bonus: a PowerShell script to simplify this task The IP address of the WSL VM changes every time it reboots (like when you power off your Windows), so if you have already added a port proxy for an IP address, it might not work if you restart your computer. I have created a PowerShell script to simplify this task when you need it to be done. You could also configure a Windows task to execute this PowerShell script on every reboot, if you also start WSL on boot (because WSL needs to be launched to get its IP address). Or could be a way to executing it from WSL once it starts. I'm not explaining here how to achieve this, as I don't have configured it that way. I don't usually access apps running inside WSL from my LAN, so when I need to do this, I just execute the following script in an administrator PowerShell terminal : (explanation below) $remoteport = bash.exe -c "ip -4 addr show eth0 | grep -oP '(?<=inet\s)\d+(\.\d+){3}'"
$found = $remoteport -match '\d{1,3}\.\d{1,3}\.\d{1,3}\.\d{1,3}';

if( $found ){
  $remoteport = $matches[0];
} else{
  echo "The Script Exited, the ip address of WSL 2 cannot be found";
  exit;
}

#[Ports]

#All the ports you want to forward separated by coma
$ports=@(80,443,3000,3001,3002,3333,5000,5432,6000,8080,8081,19000,19001);


#[Static ip]
#You can change the addr to your ip config to listen to a specific address
$addr='0.0.0.0';
$ports_a = $ports -join ",";


#Remove Firewall Exception Rules
iex "Remove-NetFireWallRule -DisplayName 'WSL 2 Firewall Unlock' ";

#adding Exception Rules for inbound and outbound Rules
iex "New-NetFireWallRule -DisplayName 'WSL 2 Firewall Unlock' -Direction Outbound -LocalPort $ports_a -Action Allow -Protocol TCP";
iex "New-NetFireWallRule -DisplayName 'WSL 2 Firewall Unlock' -Direction Inbound -LocalPort $ports_a -Action Allow -Protocol TCP";

for( $i = 0; $i -lt $ports.length; $i++ ){
  $port = $ports[$i];
  iex "netsh interface portproxy delete v4tov4 listenport=$port listenaddress=$addr";
  iex "netsh interface portproxy add v4tov4 listenport=$port listenaddress=$addr connectport=$port connectaddress=$remoteport";
} What this script does is: Gets the IP address of the WSL VM. Defines the ports you want to proxy/forward. You can therefore edit the array as you wish. Here I have written all the ports I could potentially use, so the script will be valid for multiple apps/technologies. $ports Adds Windows Firewall rules to allow all inbound/outbound traffic to the WSL. Also removes old rules from previous script executions (with different IP addresses). Adds the required port proxies, at the same times that removes old ones from old script executions (with different IP addresses). If there is the first time that you execute this script, or you have added a new port, you can get a lot of messages. These are normal warnings that you can safely ignore, as these occur because the script is trying to delete non-existent firewall rules (first time execution) or port proxies (when you add a new port). not found I hope this serves you to improve your developer experience in WSL and make you more productive. If you want to continue improving your WSL experience, check . how to run GUI applications on WSL2

Microsoft

I have much more articles on my website. Take a look!

Read My Stories

Nominated for 2022 - HackerNoon Contributor of the Year - Networking

Too Long; Didn't Read

Boost your HackerNoon story @ $159.99! 🚀

Accessing Network Apps Running Inside WSL2 from Other Devices in Your LAN

About Author

Comments

TOPICS

THIS ARTICLE WAS FEATURED IN

Related Stories

104 Stories To Learn About Go

105 Stories To Learn About Functional Programming

100+ Free Pluralsight Courses to learn Python, Java, and Spring Boot

10 Websites to Learn JavaScript for Beginners

104 Stories To Learn About Programming Top Story

10 Ways to Prevent and Manage Technical Debt—Tips from Developers

104 Stories To Learn About Go

105 Stories To Learn About Functional Programming

100+ Free Pluralsight Courses to learn Python, Java, and Spring Boot

10 Websites to Learn JavaScript for Beginners

104 Stories To Learn About Programming Top Story

10 Ways to Prevent and Manage Technical Debt—Tips from Developers

Light-Mode

Classic

Newspaper

Dark-Mode

Neon Noir

Minty

HN StartUps