Jak używać tuneli deweloperskich w programie Visual Studio 2022 z aplikacjami ASP.NET Core

Funkcja tuneli deweloperskich programu Visual Studio 2022 umożliwia nawiązywanie połączeń ad hoc między maszynami, które nie mogą łączyć się bezpośrednio ze sobą. Zostanie utworzony adres URL umożliwiający nawiązywanie połączenia z internetem dowolnego urządzenia z połączeniem internetowym w celu nawiązania połączenia z projektem ASP.NET Core podczas uruchamiania go na hoście lokalnym.

Przypadki użycia

Niektóre scenariusze, które umożliwiają tunele deweloperskie:

• Przetestuj aplikację internetową na innych urządzeniach, takich jak telefony komórkowe i tablety.
• Testowanie aplikacji za pomocą usług zewnętrznych. Na przykład przetestuj i debuguj łączniki platformy Power Platform, interfejsy API usług Azure Communication Services lub elementy webhook usługi Twilio.
• Udostępnij aplikację innym osobom za pośrednictwem Internetu, aby uzyskać prezentację lub zaprosić inne osoby do przejrzenia pracy w aplikacji internetowej lub interfejsie API.
• Alternatywą dla innych rozwiązań do przekazywania portów.

Wymagania wstępne

• Program Visual Studio 2022 w wersji 17.6 lub nowszej z zainstalowanym pakietem roboczym ASP.NET i tworzenie aplikacji internetowych. Musisz zalogować się do programu Visual Studio, aby utworzyć tunele deweloperskie i korzystać z nich. Funkcja jest niedostępna w aplikacji Visual Studio dla komputera Mac.
• Co najmniej jeden projekt ASP.NET Core. W tym artykule użyto rozwiązania z dwoma przykładowymi projektami, aby zademonstrować tę funkcję.

Tworzenie tunelu

Aby utworzyć tunel:

W programie Visual Studio 2022 otwórz projekt internetowy ASP.NET Core lub rozwiązanie z co najmniej jednym projektem internetowym ustawionym jako projekt startowy.

Z listy rozwijanej debugowania wybierz pozycję Tunele deweloperskie>Utwórz tunel.

Zostanie otwarte okno dialogowe tworzenia tunelu.

• Wybierz konto, które ma być używane do utworzenia tunelu. Typy kont, których można użyć do tworzenia tuneli, obejmują platformę Azure, konto Microsoft (MSA) i usługę GitHub.
• Wprowadź nazwę tunelu. Ta nazwa identyfikuje tunel w interfejsie użytkownika programu Visual Studio.
• Wybierz typ tunelu, trwały lub tymczasowy:
  • Tunel tymczasowy pobiera nowy adres URL za każdym razem, gdy program Visual Studio jest uruchamiany.
  • Trwały tunel pobiera ten sam adres URL za każdym razem, gdy program Visual Studio jest uruchamiany. Aby uzyskać więcej informacji, zobacz Trwałe i tymczasowe tunele w dalszej części tego artykułu.
• Wybierz uwierzytelnianie wymagane do uzyskania dostępu do tunelu. Dostępne są następujące opcje:
  • Prywatny: tunel jest dostępny tylko dla utworzonego konta.
  • Organizacja: tunel jest dostępny dla kont w tej samej organizacji co ten, który go utworzył. Jeśli ta opcja jest wybrana dla osobistego konta Microsoft (MSA), efekt jest taki sam jak wybranie opcji Prywatne. Obsługa kont usługi GitHub w organizacji nie jest obsługiwana.
  • Publiczne: brak wymaganego uwierzytelniania. Wybierz tę opcję tylko wtedy, gdy jest bezpieczna, aby aplikacja internetowa lub interfejs API był dostępny dla wszystkich użytkowników w Internecie.
• Wybierz przycisk OK.

Program Visual Studio wyświetla potwierdzenie utworzenia tunelu:

Tunel zostanie wyświetlony w wysuwanym menu rozwijanym Tunele deweloperskie debugowania:

Określanie aktywnego tunelu

Projekt lub rozwiązanie może mieć wiele tuneli, ale tylko jeden naraz jest aktywny. Menu wysuwane Tunele deweloperskie na liście rozwijanej debugowania może określać aktywny tunel. Gdy istnieje aktywny tunel, jest on używany dla wszystkich projektów ASP.NET Core uruchomionych w programie Visual Studio. Po wybraniu tunelu jako aktywnego pozostaje aktywny do momentu zamknięcia programu Visual Studio. Na poniższej ilustracji mój tunel tymczasowy jest aktywny:

Wybierz opcję Nie używaj tunelu, wybierając pozycję Brak w oknie wysuwanym. Po ponownym uruchomieniu programu Visual Studio domyślnie jest przywracana wartość Brak.

Korzystanie z tunelu

Gdy tunel jest aktywny, a program Visual Studio uruchamia aplikację internetową, przeglądarka internetowa otwiera adres URL tunelu zamiast adresu URL hosta lokalnego. Adres URL tunelu wygląda następująco:

https://0pbvlk3m-7032.usw2.devtunnels.ms

Teraz każdy uwierzytelniony użytkownik może otworzyć ten sam adres URL na dowolnym innym urządzeniu połączonym z Internetem. Jeśli projekt będzie nadal działać lokalnie, każde urządzenie z połączeniem internetowym może uzyskać dostęp do aplikacji internetowej uruchomionej na maszynie dewelopera.

W przypadku projektów internetowych, które obsługują przeglądarkę, zostanie wyświetlona strona ostrzegawcza pierwszego żądania wysłanego do adresu URL tunelu z każdego urządzenia:

Po wybraniu opcji Kontynuuj żądanie jest kierowane do lokalnej aplikacji internetowej. Ta strona powiadomień nie jest wyświetlana dla żądań interfejsu API przy użyciu tuneli deweloperskich.

Testowanie za pomocą tunelu na telefonie lub tablecie

Aby przetestować aplikację internetową z urządzenia zewnętrznego, takiego jak telefon lub tablet, przejdź do adresu URL tunelu. Aby ułatwić odtworzenie adresu URL na urządzeniu zewnętrznym:

• Przejdź do adresu URL tunelu w przeglądarce Edge na komputerze lokalnym.
• Wygeneruj kod QR do adresu URL w przeglądarce Edge na komputerze lokalnym:
  • Wybierz pasek adresu URL, a zostanie wyświetlony przycisk Kod QR.
  • Wybierz przycisk Kod QR, aby wygenerować i wyświetlić kod QR.
• Skanuj ten kod QR za pomocą telefonu lub tabletu, aby przejść do adresu URL.

Okno danych wyjściowych aplikacji Dev Tunnels

Aby wyświetlić adres URL tunelu uruchomionego projektu, wybierz pozycję Tunele deweloperskie na liście rozwijanej Pokaż dane wyjściowe .

To okno jest szczególnie przydatne w przypadku projektów, które domyślnie nie otwierają przeglądarki. Na przykład podczas pracy z funkcją platformy Azure najłatwiej jest odnaleźć publiczny adres URL używany przez tunel deweloperski.

Okno narzędzia Tunele deweloperskie

Wyświetlanie tuneli deweloperskich i zarządzanie nimi w oknie narzędzia Tunele deweloperskie :

Aby otworzyć okno Tunele deweloperskie, wybierz opcję Menu Pokaż tunele deweloperskie na liście rozwijanej debugowania. Alternatywnie wybierz pozycję Wyświetl>inne tunele deweloperskie systemu Windows.>

W oknie Tunele deweloperskie utwórz nowy tunel, wybierając zielony + przycisk.

Usuń tunel przy użyciu czerwonego x przycisku po prawej stronie tunelu.

Menu kontekstowe tunelu udostępnia następujące opcje:

• Wyczyść aktywny tunel: pokazano, gdy tunel jest skonfigurowany jako aktywny (wskazywany przez znacznik wyboru po lewej stronie), spowoduje to zresetowanie go tak, aby rozwiązanie nie używało tunelu.
• Utwórz aktywny tunel: pokazano dla tuneli, które nie są skonfigurowane jako aktywne.
• Kopiowanie tokenu dostępu tunelu: podano w scenariuszach, w których tunel jest tworzony z dostępem prywatnym lub organizacyjnym, a aplikacja jest internetowym interfejsem API. Aby uwierzytelnić się w tunelu, skopiuj i wklej token dostępu tunelu jako nagłówek formularza X-Tunnel-Authorization tunnel <TOKEN> w żądaniu. Jeśli ten nagłówek nie zostanie określony, żądanie zostanie zablokowane, ponieważ sprawdzanie uwierzytelniania nie powiodło się.
• Usuń

Zmienne środowiskowe adresu URL tunelu

Funkcja tuneli deweloperskich umożliwia programowe uzyskiwanie adresu URL tunelu projektu w czasie wykonywania. Po uruchomieniu aplikacji korzystającej z tunelu program Visual Studio tworzy zmienną środowiskową VS_TUNNEL_URL. Wartość VS_TUNNEL_URL to adres URL tunelu używanego dla bieżącego projektu. VS_TUNNEL_URL może być przydatne podczas integrowania aplikacji z usługą zewnętrzną, gdzie adres URL tunelu musi zostać przekazany do usługi zewnętrznej.

Jeśli wiele projektów ASP.NET Core jest skonfigurowanych do uruchamiania w programie Visual Studio, aplikacja uruchamiana pobiera zmienną środowiskową dla dowolnego projektu, który został uruchomiony przed nim. Wzorzec dla tej nazwy zmiennej to VS_TUNNEL_URL_{ProjectName}, gdzie {ProjectName} jest nazwą innego projektu. Rozważmy na przykład ten przykład pokazujący dwa projekty ustawione na rozpoczęcie:

Ponieważ interfejs MyWebApi jest powyżej aplikacji MyWebApp, jest uruchamiany przed projektem MyWebApp. Po uruchomieniu projektu MyWebApi otrzymuje adres URL tunelu w zmiennej środowiskowej VS_TUNNEL_URL . Po uruchomieniu projektu MyWebApp otrzymuje własny adres URL tunelu w pliku VS_TUNNEL_URL , a adres URL tunelu innego projektu jest udostępniany w zmiennej środowiskowej VS_TUNNEL_URL_MyWebApi .

Aby zilustrować, następujące wyróżnione wiersze kodu zostały dodane do pliku Program.cs w aplikacji MyWebApp:

public class Program
{
    public static void Main(string[] args)
    {
        Console.WriteLine($"Tunnel URL: {Environment.
            GetEnvironmentVariable("VS_TUNNEL_URL")}");
        Console.WriteLine($"API project tunnel URL: {Environment.
            GetEnvironmentVariable("VS_TUNNEL_URL_MyWebApi")}");

Po uruchomieniu aplikacji internetowej dane wyjściowe konsoli wyglądają jak w poniższym przykładzie:

Tunnel URL: https://lxm0ltdt-7175.usw2.devtunnels.ms/
API project tunnel URL: https://lxm0ltdt-7042.usw2.devtunnels.ms/
info: Microsoft.Hosting.Lifetime[14]
      Now listening on: https://localhost:7175
info: Microsoft.Hosting.Lifetime[14]
      Now listening on: http://localhost:5228
info: Microsoft.Hosting.Lifetime[0]
      Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
      Hosting environment: Development
info: Microsoft.Hosting.Lifetime[0]
      Content root path: C:\DevTunnelsDemo\MyWebApp

Aby uzyskać informacje o sposobie konfigurowania wielu projektów startowych, zobacz How to: Set multiple startup projects (Instrukcje: ustawianie wielu projektów startowych).

Tunele trwałe i tymczasowe

Trwały tunel to taki, który używa tego samego adresu URL po zakończeniu i ponownym uruchomieniu programu Visual Studio. Posiadanie adresu URL, który nie zmienia się, może być przydatne podczas integrowania aplikacji internetowej z usługą zewnętrzną. Na przykład zaimplementowanie elementu webhook usługi GitHub lub utworzenie interfejsu API w celu zintegrowania z aplikacją platformy Power Platform. W takich przypadkach może być konieczne określenie adresu URL wywołania zwrotnego do usługi zewnętrznej. W przypadku tunelu trwałego adres URL usługi zewnętrznej musi być skonfigurowany tylko raz. Przy użyciu tunelu tymczasowego adres URL tunelu należy skonfigurować przy każdym ponownym uruchomieniu programu Visual Studio.

Trwałe nie oznacza, że tunel działa, gdy program Visual Studio nie jest otwarty. Adres URL tunelu łączy się z maszyną lokalną tylko wtedy, gdy projekt ASP.NET Core, z którym łączy się adres URL tunelu, jest uruchomiony w programie Visual Studio.

Tunel tymczasowy jest w porządku, gdy adres URL tunelu deweloperskiego musi działać przez krótki czas. Na przykład udostępnianie w toku pracy nad aplikacją internetową innym osobom lub testowanie aplikacji na urządzeniu zewnętrznym. W niektórych przypadkach najlepszym rozwiązaniem może być uzyskanie nowego adresu URL przy każdym uruchomieniu programu Visual Studio.

Zobacz też

Następujące zasoby używają wczesnej wersji zapoznawczej funkcji tuneli deweloperskich, więc ich części są nieaktualne:

• Debugowanie internetowych interfejsów API za pomocą tuneli deweloperskich w programie Visual Studio
• AcS Call Automation i Azure OpenAI Service
• Używanie tuneli deweloperskich programu Visual Studio do obsługi elementów webhook usługi Twilio.