Använda utvecklingstunnlar i Visual Studio 2022 med ASP.NET Core-appar

Funktionen dev tunnels i Visual Studio 2022 möjliggör ad hoc-anslutningar mellan datorer som inte kan ansluta direkt till varandra. En URL skapas som gör att alla enheter med en Internetanslutning kan ansluta till ett ASP.NET Core-projekt medan det körs på localhost.

Användningsfall

Några av de scenarier som utvecklingstunnlar aktiverar:

• Testa en webbapp på andra enheter, till exempel mobiltelefoner och surfplattor.
• Testa en app med externa tjänster. Du kan till exempel testa och felsöka Power Platform-anslutningsappar, Api:er för Azure Communication Services eller Twilio-webhooks.
• Gör en app tillfälligt tillgänglig för andra via Internet, för en presentation eller för att bjuda in andra att granska ditt arbete i en webbapp eller ett API.
• Som ett alternativ till andra lösningar för portvidarebefordran.

Förutsättningar

• Visual Studio 2022 version 17.6 eller senare med arbetsbelastningen ASP.NET och webbutveckling installerad. Du måste vara inloggad i Visual Studio för att skapa och använda utvecklingstunnlar.
• Ett eller flera ASP.NET Core-projekt. Den här artikeln använder en lösning med två exempelprojekt för att demonstrera funktionen.

Skapa en tunnel

Så här skapar du en tunnel:

I Visual Studio 2022 öppnar du ett ASP.NET Core-webbprojekt eller en lösning med minst ett webbprojekt inställt som startprojekt.

I listrutan felsökning väljer du Dev Tunnels Create A Tunnel ( Utvecklingstunnlar>Skapa en tunnel).

Dialogrutan för att skapa tunneln öppnas.

• Välj det konto som ska användas för att skapa tunneln. Kontotyper som kan användas för att skapa tunnlar är Azure, Microsoft-konto (MSA) och GitHub.
• Ange ett namn för tunneln. Det här namnet identifierar tunneln i Visual Studio-användargränssnittet.
• Välj tunneltyp, Beständiga eller tillfälliga:
  • En tillfällig tunnel hämtar en ny URL varje gång Visual Studio startas.
  • En beständig tunnel får samma URL varje gång Visual Studio startas. Mer information finns i Beständiga eller tillfälliga tunnlar senare i den här artikeln.
• Välj den autentisering som krävs för åtkomst till tunneln. Följande alternativ är tillgängliga:
  • Privat: Tunneln är endast tillgänglig för det konto som skapade den.
  • Organisation: Tunneln är tillgänglig för konton i samma organisation som den som skapade den. Om det här alternativet har valts för ett personligt Microsoft-konto (MSA) är effekten samma som att välja Privat. Organisationsstöd för Github-konton stöds inte.
  • Offentligt: Ingen autentisering krävs. Välj endast det här alternativet om det är säkert att göra webbappen eller API:et tillgängligt för alla på Internet.
• Välj OK.

Visual Studio visar bekräftelse på tunnelskapande:

Tunneln visas i den utfällbara listrutan Dev Tunnels :

Rullgardinsmenyn för felsökning av Dev Tunnels som visar ny tunnel.

Ange den aktiva tunneln

Ett projekt eller en lösning kan ha flera tunnlar, men bara en i taget är aktiv. Den utfällbara menyn Dev Tunnels i listrutan för felsökning kan ange den aktiva tunneln. När det finns en aktiv tunnel används den för alla ASP.NET Core-projekt som startas i Visual Studio. När en tunnel har valts som aktiv förblir den aktiv tills Visual Studio stängs. I följande bild är Min temporära tunnel aktiv:

Välj att inte använda en tunnel genom att välja Ingen i den utfällbara menyn. När Visual Studio startas om återgår det som standard till Ingen.

Använda en tunnel

När en tunnel är aktiv och Visual Studio kör en webbapp öppnas webbläsaren till en tunnel-URL i stället för en localhost-URL. Tunnel-URL:en ser ut som i följande exempel:

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

Nu kan alla autentiserade användare öppna samma URL på alla andra Internetanslutna enheter. Så länge projektet fortsätter att köras lokalt kan alla enheter med en Internetanslutning komma åt webbprogrammet som körs på en utvecklingsdator.

För webbprojekt som har webbläsarstöd visas en varningssida på den första begäran som skickas till tunnel-URL:en från varje enhet:

När Fortsätt har valts dirigeras begäran till den lokala webbappen. Den här meddelandesidan visas inte för API-begäranden med hjälp av utvecklingstunnlar.

Använda en tunnel för att testa på en telefon eller surfplatta

Om du vill testa en webbapp från en extern enhet som en telefon eller surfplatta går du till tunnel-URL:en. Så här gör du det enklare att återskapa URL:en på den externa enheten:

• Gå till tunnel-URL:en i en Edge-webbläsare på den lokala datorn.
• Generera en QR-kod till URL:en i Edge-webbläsaren på den lokala datorn:
  • Välj URL-fältet och knappen QR-kod visas.
  • Välj QR-kodknappen för att generera och visa QR-koden.
• Genomsök den här QR-koden med en telefon eller surfplatta för att navigera till URL:en.

Utdatafönster för Dev Tunnels

Om du vill visa URL:en för en tunnel i ett projekt som körs väljer du Dev Tunnels i listrutan Visa utdata .

Det här fönstret är särskilt användbart för projekt som inte öppnar en webbläsare som standard. När du till exempel arbetar med en Azure-funktion kan det här vara det enklaste sättet att identifiera den offentliga URL:en som används av utvecklingstunneln.

Verktygsfönstret Dev Tunnels

Visa och hantera utvecklingstunnlar i fönstret Dev Tunnels-verktyget :

Om du vill öppna fönstret Dev Tunnels, välj menyalternativet Visa Dev Tunnels-fönstret i listrutan för felsökning. Alternativt kan du välja Visa>Andra Windows>Dev-tunnlar.

I fönstret Dev Tunnels skapar du en ny tunnel genom att välja den gröna + knappen.

Ta bort en tunnel med hjälp av den röda x knappen till höger om tunneln.

Snabbmenyn för en tunnel innehåller följande alternativ:

• Rensa aktiv tunnel: Visas när en tunnel har konfigurerats som aktiv (markerad med bockmarkeringen till vänster) återställer den så att lösningen inte använder en tunnel.
• Skapa aktiv tunnel: Visas för tunnlar som inte har konfigurerats som aktiva.
• Kopiera tunnelåtkomsttoken: Tillhandahålls för scenarier där en tunnel skapas med privat eller organisatorisk åtkomst och appen är ett webb-API. Om du vill autentisera för tunneln kopierar och klistrar du in tunnelåtkomsttoken som en rubrik i formuläret X-Tunnel-Authorization tunnel <TOKEN> i begäran. Om headern inte anges blockeras begäran eftersom autentiseringskontrollen misslyckades.
• Avlägsna

Miljövariabler för tunnel-URL

Funktionen dev tunnels är ett sätt att hämta tunnel-URL:en för ett projekt programmatiskt vid körning. När en app startas som använder en tunnel skapar Visual Studio miljövariabeln VS_TUNNEL_URL. Värdet VS_TUNNEL_URL är URL:en för tunneln som används för det aktuella projektet. VS_TUNNEL_URL kan vara användbart när du integrerar appen med en extern tjänst, där tunnel-URL:en måste skickas till den externa tjänsten.

Om flera ASP.NET Core-projekt har konfigurerats för att starta i Visual Studio får appen som startar en miljövariabel för alla projekt som startade före den. Mönstret för det här variabelnamnet är VS_TUNNEL_URL_{ProjectName}, där {ProjectName} är namnet på det andra projektet. Föreställ dig till exempel att två projekt ska starta:

Eftersom MyWebApi ligger ovanför MyWebApp startas det innan MyWebApp-projektet. När Projektet MyWebApi startas tar det emot dess tunnel-URL i VS_TUNNEL_URL miljövariabeln. När MyWebApp-projektet startas tar det emot en egen tunnel-URL i VS_TUNNEL_URL och det andra projektets tunnel-URL anges i VS_TUNNEL_URL_MyWebApi miljövariabeln.

För att illustrera har följande markerade kodrader lagts till i filen Program.cs i 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")}");

När webbappen startas ser konsolutdata ut som i följande exempel:

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

Information om hur du konfigurerar flera startprojekt finns i Så här ställer du in flera startprojekt.

Beständiga kontra tillfälliga tunnlar

En beständig tunnel är en tunnel som använder samma URL när du har avslutat och startat om Visual Studio. Att ha en URL som inte ändras kan vara användbart när du integrerar en webbapp med en extern tjänst. Du kan till exempel implementera en GitHub-webhook eller utveckla ett API för att integrera med en Power Platform-app. I sådana fall kan du behöva ange återanrops-URL:en till den externa tjänsten. Med en beständig tunnel behöver url:en för den externa tjänsten bara konfigureras en gång. Med hjälp av en tillfällig tunnel måste tunnel-URL:en konfigureras varje gång Visual Studio startas om.

Beständiga innebär inte att tunneln fungerar när Visual Studio inte är öppet. En tunnel-URL ansluter endast till den lokala datorn om ASP.NET Core-projektet som tunnel-URL:en ansluter till körs i Visual Studio.

En tillfällig tunnel fungerar bra när utvecklingstunnelns URL måste fungera under en kort tid. Till exempel att dela pågående arbete på en webbapp med andra eller att testa en app på en extern enhet. I vissa fall kan det vara bäst att skaffa en ny URL varje gång Visual Studio startar.

Se även

Följande resurser använder en tidig förhandsversion av dev tunnels-funktionen, så delar av dem är inaktuella:

• Använda utvecklingstunnlar i Visual Studio för att felsöka dina webb-API:er
• ACS Call Automation och Azure OpenAI Service
• Använd Visual Studio dev-tunnlar för att hantera Twilio Webhooks.