Dev Tunnels for Mobile Development

Dusty Shaw — Fri, 16 Feb 2024 18:30:25 +0000

Have you ever wanted to share your project with someone without having to publish? Or maybe when you run an emulator using your API, you get a 404 error on your API endpoints. Dev tunnels for Visual Studio 2022 create a unique URL that you can use in your mobile projects to debug API's. Visual Studio 2022 now let's you create dev tunnels with a click of button.

The Scenario

Say you have an API running in your mobile app. This mobile app calls an API at a local URL (ex. https://localhost:7223). However, when you want to run an emulator, the emulator has its own network, so it can't find the local host.

1. Make a Dev Tunnel using Visual Studio 2022

To create a Dev Tunnel, go to the run button and hover over the drop down menu. Go to Dev Tunnels > Create a Tunnel....

A window will pop up for some settings on your tunnel.

Configure your GitHub (you will likely have to log in)
Give it a name
Tunnel Type
- Temporary: will give a unique URL each time you open Visual Studio
- Persistent: URL will persist between runs
Privacy:
- private: only accessible to you (safest)
- organization: only accessible to the same organization associated with the account.
- public: anyone with a URL can access your tunnel (not as safe)

Hit "Ok" to create your dev tunnel.

2. Run Using your Dev Tunnel

In the same drop down menu, select the dev tunnel you just created.
Dev Tunnels > My First Tunnel

3. See Output

Run your app and click continue on the blue screen that shows up. This is there to warn you that you are entering a dev tunnel that could be public.

Look at the URL. That's not localhost! It creates a unique URL so that people can now talk to your project and API through the internet, including those pesky API endpoints.

Old URL: https://localhost:7223/swagger/index.html
New URL: https://50tt58xr-7223.usw2.devtunnels.ms/swagger/indexf.html

4. Manage your Dev Tunnels

You can manage your Dev Tunnels in the "Dev Tunnel Dashboard" page in Visual Studio.

Summary

You have created your first Dev Tunnel using Visual Studio. Now you can create unique URLs that you can use for debugging API endpoints, webhooks, or simply for sharing your project across devices.

Have Fun!
Thanks for reading!