Come usare i tunnel di sviluppo in Visual Studio 2022 con app ASP.NET Core

La funzionalità dev tunnels di Visual Studio 2022 consente connessioni ad hoc tra computer che non possono connettersi direttamente tra loro. Viene creato un URL che consente a qualsiasi dispositivo con una connessione Internet di connettersi a un progetto ASP.NET Core durante l'esecuzione in localhost.

Casi d'uso

Alcuni degli scenari abilitati dai tunnel di sviluppo:

  • Testare un'app Web in altri dispositivi, ad esempio telefoni cellulari e tablet.
  • Testare un'app con servizi esterni. Ad esempio, testare ed eseguire il debug di connettori power platform, API Servizi di comunicazione di Azure o webhook Twilio.
  • Rendere un'app temporaneamente disponibile per altri utenti tramite Internet, per una presentazione o per invitare altri utenti a esaminare il lavoro in un'app Web o in un'API.
  • In alternativa ad altre soluzioni di port forwarding.

Prerequisiti

  • Visual Studio 2022 versione 17.6 o successiva con il carico di lavoro ASP.NET e sviluppo Web installato. È necessario accedere a Visual Studio per creare e usare i tunnel di sviluppo. La funzionalità non è disponibile in Visual Studio per Mac.
  • Uno o più progetti ASP.NET Core. Questo articolo usa una soluzione con due progetti di esempio per illustrare la funzionalità.

Creare un tunnel

Per creare un tunnel:

In Visual Studio 2022 aprire un progetto Web ASP.NET Core o una soluzione con almeno un progetto Web impostato come progetto di avvio.

Nell'elenco a discesa debug selezionare Dev Tunnels Create A Tunnel (>Crea un tunnel).

Debug dropdown showing dev tunnels option with Create tunnel selected

Verrà visualizzata la finestra di dialogo di creazione del tunnel.

Dev Tunnel creation dialog.

  • Selezionare l'account da usare per creare il tunnel. I tipi di account che possono essere usati per creare tunnel includono Azure, Account Microsoft (MSA) e GitHub.
  • Immettere un nome per il tunnel. Questo nome identifica il tunnel nell'interfaccia utente di Visual Studio.
  • Scegliere il tipo di tunnel, Persistente o Temporaneo:
    • Un tunnel temporaneo ottiene un nuovo URL ogni volta che viene avviato Visual Studio.
    • Un tunnel permanente ottiene lo stesso URL ogni volta che viene avviato Visual Studio. Per altre informazioni, vedere Tunnel permanenti e temporanei più avanti in questo articolo.
  • Scegliere l'autenticazione necessaria per l'accesso al tunnel. Sono disponibili le opzioni seguenti:
    • Privato: il tunnel è accessibile solo all'account che lo ha creato.
    • Organizzazione: il tunnel è accessibile agli account nella stessa organizzazione di quella che l'ha creata. Se questa opzione è selezionata per un account Microsoft personale ( MSA), l'effetto è uguale a quello della selezione di Privato. Il supporto dell'organizzazione per gli account GitHub non è supportato.
    • Pubblico: nessuna autenticazione necessaria. Scegliere questa opzione solo se è sicuro rendere l'app Web o l'API accessibile a chiunque su Internet.
  • Seleziona OK.

Visual Studio visualizza la conferma della creazione del tunnel:

Notification of successful tunnel creation.

Il tunnel viene visualizzato nel riquadro a comparsa Dev Tunnels nell'elenco a discesa debug:

Debug dropdown Dev Tunnels flyout showing new tunnel.

Specificare il tunnel attivo

Un progetto o una soluzione può avere più tunnel, ma solo uno alla volta è attivo. Il riquadro a comparsa Dev Tunnels nell'elenco a discesa debug può specificare il tunnel attivo. Quando è presente un tunnel attivo, viene usato per tutti i progetti core ASP.NET avviati in Visual Studio. Dopo aver selezionato un tunnel come attivo, rimane attivo fino alla chiusura di Visual Studio. Nella figura seguente il tunnel temporaneo è attivo:

Debug dropdown showing active tunnel in Dev Tunnels flyout.

Scegliere di non usare un tunnel selezionando Nessuno nel riquadro a comparsa. Quando Visual Studio viene riavviato, il valore predefinito è Nessuno.

Usare un tunnel

Quando un tunnel è attivo e Visual Studio esegue un'app Web, il Web browser si apre a un URL di tunnel anziché a un URL localhost. L'URL del tunnel è simile all'esempio seguente:

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

Ora qualsiasi utente autenticato può aprire lo stesso URL in qualsiasi altro dispositivo connesso a Internet. Finché il progetto continua a essere eseguito in locale, qualsiasi dispositivo con una connessione Internet può accedere all'applicazione Web in esecuzione in un computer di sviluppo.

Per i progetti Web con supporto browser, viene visualizzata una pagina di avviso nella prima richiesta inviata all'URL del tunnel da ogni dispositivo:

Dev tunnels notification page.

Dopo aver selezionato Continua , la richiesta viene instradata all'app Web locale. Questa pagina di notifica non viene visualizzata per le richieste API che usano i tunnel di sviluppo.

Usare un tunnel per testare un telefono o un tablet

Per testare un'app Web da un dispositivo esterno, ad esempio un telefono o un tablet, passare all'URL del tunnel. Per semplificare la riproduzione dell'URL nel dispositivo esterno:

  • Passare all'URL del tunnel in un browser Edge nel computer locale.
  • Generare un codice a matrice nell'URL nel browser Edge nel computer locale:
    • Selezionare la barra URL e viene visualizzato il pulsante Codice a matrice.
    • Selezionare il pulsante Codice a matrice per generare e visualizzare il codice a matrice. QR code with button to create it highlighted.
  • Analizza questo codice a matrice con un telefono o un tablet per passare all'URL.

Finestra di output di Dev Tunnels

Per visualizzare l'URL di un tunnel di un progetto in esecuzione, selezionare Dev Tunnels nell'elenco a discesa Mostra output.

Dev Tunnels output window.

Questa finestra è particolarmente utile per i progetti che non aprono un browser per impostazione predefinita. Ad esempio, quando si usa una funzione di Azure, questo può essere il modo più semplice per individuare l'URL pubblico usato dal tunnel di sviluppo.

Finestra degli strumenti Dev Tunnels

Visualizzare e gestire i tunnel di sviluppo nella finestra degli strumenti Dev Tunnels :

Dev Tunnels tool window.

Per aprire la finestra Dev Tunnels (Dev Tunnels), selezionare l'opzione di menu Show Dev Tunnels Window (Mostra finestra Tunnel di sviluppo) nell'elenco a discesa debug. In alternativa, selezionare Visualizza>altri tunnel di sviluppo di Windows.>

Nella finestra Dev Tunnels (Dev Tunnels) creare un nuovo tunnel selezionando il pulsante verde+.

Eliminare un tunnel usando il pulsante rosso x a destra del tunnel.

Il menu di scelta rapida per un tunnel offre le opzioni seguenti:

  • Cancella tunnel attivo: visualizzato quando un tunnel è configurato come attivo (indicato dal segno di spunta a sinistra), lo reimposta in modo che la soluzione non usi un tunnel.
  • Crea tunnel attivo: visualizzato per i tunnel non configurati come attivi.
  • Copiare il token di accesso al tunnel: fornito per scenari in cui viene creato un tunnel con accesso privato o aziendale e l'app è un'API Web. Per eseguire l'autenticazione per il tunnel, copiare e incollare il token di accesso al tunnel come intestazione del modulo X-Tunnel-Authorization tunnel <TOKEN> nella richiesta. Se questa intestazione non è specificata, la richiesta verrà bloccata perché il controllo di autenticazione non è riuscito.
  • Rimuovi

Variabili di ambiente dell'URL del tunnel

La funzionalità dev tunnels consente di ottenere l'URL del tunnel di un progetto a livello di codice in fase di esecuzione. Quando viene avviata un'app che usa un tunnel, Visual Studio crea la variabile VS_TUNNEL_URLdi ambiente . Il VS_TUNNEL_URL valore è l'URL del tunnel usato per il progetto corrente. VS_TUNNEL_URL può essere utile quando si integra l'app con un servizio esterno, in cui l'URL del tunnel deve essere passato al servizio esterno.

Se più progetti ASP.NET Core sono configurati per l'avvio in Visual Studio, l'app che sta avviando ottiene una variabile di ambiente per qualsiasi progetto avviato prima. Il modello per questo nome di variabile è VS_TUNNEL_URL_{ProjectName}, dove {ProjectName} è il nome dell'altro progetto. Si consideri ad esempio questo esempio che mostra due progetti impostati per l'avvio:

Startup projects selection page showing MyWebApi and MyWebApp both starting, in that order.

Poiché MyWebApi è sopra MyWebApp, viene avviato prima del progetto MyWebApp. All'avvio del progetto MyWebApi, riceve l'URL del VS_TUNNEL_URL tunnel nella variabile di ambiente. All'avvio del progetto MyWebApp, riceve il proprio URL del tunnel in VS_TUNNEL_URL e l'URL del tunnel dell'altro progetto viene fornito nella VS_TUNNEL_URL_MyWebApi variabile di ambiente.

Per illustrare, le righe di codice evidenziate seguenti sono state aggiunte al file Program.cs in 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")}");

Quando l'app Web viene avviata, l'output della console è simile all'esempio seguente:

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

Per informazioni su come configurare più progetti di avvio, vedere Procedura: Impostare più progetti di avvio.

Tunnel permanenti e temporanei

Un tunnel persistente è uno che usa lo stesso URL dopo l'uscita e il riavvio di Visual Studio. La presenza di un URL che non cambia può essere utile quando si integra un'app Web con un servizio esterno. Ad esempio, l'implementazione di un webhook GitHub o lo sviluppo di un'API da integrare con un'app Power Platform. In questi casi, potrebbe essere necessario specificare l'URL di callback per il servizio esterno. Con un tunnel permanente, l'URL del servizio esterno deve essere configurato una sola volta. Usando un tunnel temporaneo, l'URL del tunnel deve essere configurato ogni volta che Visual Studio viene riavviato.

Persistent non significa che il tunnel funzioni quando Visual Studio non è aperto. Un URL del tunnel si connette al computer locale solo se il progetto ASP.NET Core a cui si connette l'URL del tunnel è in esecuzione in Visual Studio.

Un tunnel temporaneo è corretto quando l'URL del tunnel di sviluppo deve funzionare per un breve periodo di tempo. Ad esempio, la condivisione del lavoro in corso su un'app Web con altri utenti o il test di un'app in un dispositivo esterno. In alcuni casi, potrebbe essere preferibile ottenere un nuovo URL ogni volta che viene avviato Visual Studio.

Vedi anche

Le risorse seguenti usano una versione di anteprima anticipata della funzionalità dei tunnel di sviluppo, quindi le parti di esse non sono aggiornate: