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 su altri dispositivi, ad esempio telefoni cellulari e tablet.
  • Testare un'app con servizi esterni. Ad esempio, testare ed eseguire il debug di connettori di Power Platform, API di 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 tuo 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 Sviluppo ASP.NET e web installato. Occorre aver effettuato l'accesso a Visual Studio per creare e usare i tunnel di sviluppo.
  • 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.

menu a discesa Debug che mostra l'opzione dev tunnels con l'opzione Crea tunnel selezionata

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

Finestra di dialogo di creazione di Dev Tunnel.

  • 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 dell'account che lo ha creato. Se questa opzione è selezionata per un account Microsoft personale ( MSA), l'effetto è uguale a quello della selezione di Privato. Il supporto degli account GitHub da parte dell'organizzazione non è disponibile.
    • 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:

Notifica dell'esito positivo della creazione del tunnel.

Il tunnel viene visualizzato nel riquadro a comparsa Dev Tunnels del menu a discesa Debug:

Riquadro a comparsa Debug Dev Tunnels che mostra il nuovo tunnel.

Specificare il tunnel attivo

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

Elenco a discesa Debug che mostra il tunnel attivo nel riquadro a comparsa Dev Tunnels.

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 su 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:

Pagina di notifica dei tunnel di sviluppo.

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 su 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 il riporto dell'URL nel dispositivo esterno:

  • Passare all'URL del tunnel in un browser Edge nel computer locale.
  • Generare un codice QR per l'URL nel browser Edge nel computer locale:
    • Selezionare la barra URL e viene visualizzato il pulsante codice QR.
    • Selezionare il pulsante codice QR per generare e visualizzare il codice QR. codice QR con pulsante per crearlo evidenziato.
  • Scansiona questo codice QR 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 da.

Finestra di output di Dev Tunnels.

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 dello strumento Dev Tunnels

Visualizzare e gestire i tunnel di sviluppo nella finestra dello strumento Dev Tunnels:

Finestra degli strumenti Dev Tunnels.

Per aprire la finestra Dev Tunnels, selezionare l'opzione di menu Mostra finestra Dev Tunnels nel menu a discesa Debug. In alternativa, selezionare Visualizza>Altre finestre>Dev Tunnels.

Dalla finestra 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:

  • Disattiva 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.
  • Rendi attivo il tunnel: visualizzato per i tunnel non configurati come attivi.
  • Token di accesso al tunnel da copiare: 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 nel formato 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 si 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:

Pagina di selezione dei progetti di avvio con MyWebApi e MyWebApp entrambi avviati, in questo ordine.

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

Per illustrare, le seguenti righe di codice evidenziate 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 aver chiuso e riavviato 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 su 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:

  • Ultimo aggiornamento: