Tools

Port Forwarding in VS Code

Unlock the power of port forwarding in VS Code effortlessly, as it comes with built-in support, eliminating the need for additional extensions. Seamlessly expose your local web services to the internet and enable others to access them using the intuitive Ports view. Take your collaboration and productivity to new heights with the convenience of port forwarding in Visual Studio Code.

In the latest version of VS Code (1.82), a new module called “PORTS” has been introduced in the command line panel. This module offers a feature called Local Port Forwarding, which allows users to easily share their local services with remote networks without the need for any third-party plugins.

This functionality operates on a similar principle to that of internal network penetration, whereby a public server acts as an intermediary to map local ports to the internet.

How to use the local port forwarding feature

1. Start your project service locally, for example, by using Vite to start a project with port number 5173.

2. Switch to the ‘PORTS’ view and click the ‘Forward a Port’ button.

3. Enter the port number 5173. If you are not logged in to your GitHub account, you will be prompted to log in. Follow the instructions provided.

After completing the above steps, you will see a generated URL in the PORTS view.

You can access your local service by clicking on this URL and opening it in your browser. By default, the forwarded port is private and can only be accessed by users logged in with the same GitHub account.

If you wish to make your service publicly accessible to anyone, you can right-click on the port in the “PORTS” view and select the “Port Visibility” option, then choose “Public“.

If this is your first time using this feature, you will see the following prompt when opening the website. Simply click “Continue” to proceed with accessing it.

This feature is incredibly convenient in various scenarios such as daily development debugging and collaborative work.

In comparison to software like nps and frp that enable intranet penetration, the local port forwarding feature of VS Code is much simpler to use and does not require the possession of a public server.

Leave a Reply

Your email address will not be published. Required fields are marked *