Fejlesztői alagutak használata a Visual Studio 2022-ben ASP.NET Core-alkalmazásokkal

A Visual Studio 2022 fejlesztői alagutak funkciója alkalmi kapcsolatokat tesz lehetővé olyan gépek között, amelyek nem tudnak közvetlenül csatlakozni egymáshoz. Létrejön egy URL-cím, amely lehetővé teszi, hogy az internetkapcsolattal rendelkező eszközök csatlakozzanak egy ASP.NET Core-projekthez, miközben az a localhoston fut.

Használati esetek

A fejlesztői alagutak által engedélyezett forgatókönyvek némelyike:

• Webalkalmazás tesztelése más eszközökön, például mobiltelefonokon és táblagépeken.
• Alkalmazás tesztelése külső szolgáltatásokkal. A Power Platform-összekötők, az Azure Communication Services API-k vagy a Twilio webhookok tesztelése és hibakeresése.
• Az alkalmazást ideiglenesen elérhetővé teheti mások számára az interneten keresztül, bemutatókhoz, vagy meghívhat másokat, hogy áttekintse a munkáját egy webalkalmazáson vagy API-n.
• Más porttovábbítási megoldások alternatívaként.

Előfeltételek

• A Visual Studio 2022 17.6-os vagy újabb verziója a ASP.NET és a webfejlesztési számítási feladat telepítve van. Fejlesztői alagutak létrehozásához és használatához be kell jelentkeznie a Visual Studióba.
• Egy vagy több ASP.NET Core-projekt. Ez a cikk egy két mintaprojektet tartalmazó megoldást használ a funkció bemutatásához.

Alagút létrehozása

Alagút létrehozása:

A Visual Studio 2022-ben nyisson meg egy ASP.NET Core webes projektet, vagy egy olyan megoldást, amelynek legalább egy webes projektje indítási projektként van beállítva.

A hibakeresési legördülő listában válassza a Dev Tunnels>Create A Tunnel (Alagút létrehozása) lehetőséget.

Megnyílik az alagút létrehozása párbeszédpanel.

• Válassza ki az alagút létrehozásához használni kívánt fiókot. Az alagutak létrehozásához használható fióktípusok közé tartozik az Azure, a Microsoft Account (MSA) és a GitHub.
• Adja meg az alagút nevét. Ez a név azonosítja az alagutat a Visual Studio felhasználói felületén.
• Válassza ki az alagút típusát, állandó vagy ideiglenes:
  • Az ideiglenes alagút minden alkalommal új URL-címet kap, amikor a Visual Studio elindul.
  • Az állandó alagutak minden alkalommal ugyanazt az URL-címet kapják, amikor a Visual Studio elindul. További információ: Állandó és ideiglenes alagutak a jelen cikk későbbi részében.
• Válassza ki az alagúthoz való hozzáféréshez szükséges hitelesítést. A következő lehetőségek állnak rendelkezésre:
  • Privát: Az alagút csak az azt létrehozó fiók számára érhető el.
  • Szervezet: Az alagút a létrehozott szervezettel azonos szervezet fiókjai számára érhető el. Ha ez a beállítás egy személyes Microsoft-fiókhoz (MSA) van kiválasztva, az hatás megegyezik a Privát beállítással. A GitHub-fiókok szervezeti támogatása nem támogatott.
  • Nyilvános: Nincs szükség hitelesítésre. Ezt a lehetőséget csak akkor válassza, ha biztonságosan elérhetővé teheti a webalkalmazást vagy az API-t bárki számára az interneten.
• Válassza az OK gombot.

A Visual Studio megjeleníti az alagút létrehozásának megerősítését:

Az alagút megjelenik a hibakeresési legördülő menü Dev Tunnels kisablakában.

Az aktív alagút megadása

Egy projekt vagy megoldás több alagutat is tartalmazhat, de egyszerre csak egy lehet aktív. A hibakeresési legördülő menü Dev Tunnels felugró ablaka megadhatja az aktív alagutat. Ha aktív alagutat használ, az a Visual Studióban elindított összes ASP.NET Core-projekthez használható. Ha egy alagút aktívként van kiválasztva, a Visual Studio bezárásáig aktív marad. Az alábbi ábrán az Ideiglenes alagút aktív:

Válassza a lehetőséget, hogy ne használjon alagutat, ha a Nincs lehetőséget választja a felbukkanó menüben. Ha a Visual Studio újraindul, az alapértelmezés szerint a Nincs értékre kerül vissza.

Alagút használata

Ha egy alagút aktív, és a Visual Studio webalkalmazást futtat, a böngésző a localhost URL-cím helyett egy alagút URL-címére nyílik meg. Az alagút URL-címe a következő példához hasonlóan néz ki:

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

Mostantól bármely hitelesített felhasználó megnyithatja ugyanazt az URL-címet bármely más, internetkapcsolattal rendelkező eszközön. Amíg a projekt továbbra is helyileg fut, minden internetkapcsolattal rendelkező eszköz hozzáférhet a fejlesztőgépen futó webalkalmazáshoz.

Böngészőtámogatással rendelkező webes projektek esetén az egyes eszközökről az alagút URL-címére küldött első kérésen megjelenik egy figyelmeztető lap:

A Folytatás kiválasztása után a rendszer átirányítja a kérést a helyi webalkalmazásba. Ez az értesítési oldal nem jelenik meg a fejlesztői alagutakat használó API-kérések esetében.

Alagút használata telefonon vagy táblagépen való teszteléshez

Ha egy webalkalmazást külső eszközről, például telefonról vagy táblagépről szeretne tesztelni, keresse meg az alagút URL-címét. Az URL-cím reprodukálásának megkönnyítése a külső eszközön:

• Keresse meg az alagút URL-címét egy Edge-böngészőben a helyi gépen.
• Hozzon létre egy QR-kódot az URL-címre a helyi gépen található Edge böngészőben:
  • Válassza ki az URL-sávot, és megjelenik a QR-kód gomb.
  • Kattintson a QR-kód gombra a QR-kód létrehozásához és megtekintéséhez.
• Az URL-címre való navigáláshoz olvassa be ezt a QR-kódot egy telefonnal vagy táblagéppel.

Dev Tunnels kimeneti ablak

Egy futó projekt alagútjának URL-címének megjelenítéséhez válassza a Dev Tunnels lehetőséget a Kimenet megjelenítése legördülő listában.

Ez az ablak különösen olyan projektek esetében hasznos, amelyek alapértelmezés szerint nem nyitnak meg böngészőt. Azure-függvények használatakor például ez lehet a legegyszerűbb módja annak, hogy felderítse a fejlesztői alagút által használt nyilvános URL-címet.

A Dev Tunnels eszköz ablaka

Fejlesztői alagutak megtekintése és kezelése a Dev Tunnels eszközablakban:

A Dev Tunnels ablak megnyitásához válassza a Dev Tunnels Ablak megjelenítése menüt a hibakeresési legördülő menüben. Másik lehetőségként válassza azEgyéb Windows>fejlesztői alagutak>.

A Dev Tunnels ablakból hozzon létre egy új alagutat a zöld + gombra kattintva.

Az alagút törléséhez használja az alagút jobb oldalán található piros x gombot.

Az alagút helyi menüjében a következő lehetőségek állnak rendelkezésre:

• Aktív alagút törlése: Akkor jelenik meg, ha egy alagút aktívként van konfigurálva (a bal oldalon lévő pipa jelzi), ez alaphelyzetbe állítja, hogy a megoldás ne használjon alagutat.
• Aktív alagút létrehozása: Nem aktívként konfigurált alagutak esetén jelenik meg.
• Alagút Hozzáférési Jogkivonat Másolása: Olyan forgatókönyvekhez biztosított, ahol az alagút privát vagy szervezeti hozzáféréssel jön létre, és az alkalmazás egy webes API. Az alagút hitelesítéséhez másolja és illessze be az alagút hozzáférési jogkivonatát az űrlap X-Tunnel-Authorization tunnel <TOKEN> fejléceként a kérelemben. Ha ez a fejléc nincs megadva, a kérés le lesz tiltva, mert a hitelesítési ellenőrzés sikertelen volt.
• Eltávolít

Alagút URL-környezeti változói

A fejlesztői alagutak funkció lehetővé teszi egy projekt alagút URL-címének programozott módon való lekérését futásidőben. Amikor egy alagútot használó alkalmazás indul el, a Visual Studio létrehozza a környezeti változót VS_TUNNEL_URL. Az VS_TUNNEL_URL érték az aktuális projekthez használt alagút URL-címe. VS_TUNNEL_URL akkor lehet hasznos, ha az alkalmazást egy külső szolgáltatással integrálja, ahol az alagút URL-címét át kell adni a külső szolgáltatásnak.

Ha több ASP.NET Core-projekt úgy van konfigurálva, hogy a Visual Studióban induljon el, a kezdő alkalmazás környezeti változót kap az előtte elindított projektekhez. Ennek a változónévnek a mintája VS_TUNNEL_URL_{ProjectName} formában van, ahol {ProjectName} a másik projekt neve. Vegyük például ezt a példát, amelyben két projekt indul el:

Mivel a MyWebApi a MyWebApp felett van, a MyWebApp projekt előtt kezdődött. A MyWebApi-projekt elindításakor megkapja az alagút URL-címét a VS_TUNNEL_URL környezeti változóban. A MyWebApp projekt elindításakor megkapja a saját alagút URL-címét a VS_TUNNEL_URL-ben, és a másik projekt alagútjának URL-címét pedig a VS_TUNNEL_URL_MyWebApi környezeti változóban kapja meg.

A szemléltetés érdekében a következő kiemelt kódsorok lettek hozzáadva a Program.cs fájlhoz a MyWebAppban:

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")}");

A webalkalmazás indításakor a konzol kimenete a következő példához hasonlóan néz ki:

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

További információ több indítási projekt beállításáról : Útmutató: Több indítási projekt beállítása.

Állandó és ideiglenes alagutak

Az állandó alagutak ugyanazt az URL-címet használják a Visual Studióból való kilépés és újraindítás után. Ha egy webalkalmazást külső szolgáltatással integrál, akkor hasznos lehet, ha olyan URL-címmel rendelkezik, amely nem változik. Például egy GitHub-webhook implementálása, vagy egy API fejlesztése egy Power Platform-alkalmazással való integrációhoz. Ilyen esetekben előfordulhat, hogy meg kell adnia a külső szolgáltatás visszahívási URL-címét. Állandó alagút esetén a külső szolgáltatás URL-címét csak egyszer kell konfigurálni. Ideiglenes alagutat használva az alagút URL-címét minden alkalommal konfigurálni kell, amikor a Visual Studio újraindul.

Az állandó nem jelenti azt, hogy az alagút akkor működik, ha a Visual Studio nincs megnyitva. Az alagút URL-címe csak akkor csatlakozik a helyi géphez, ha az alagút URL-címe által összekapcsolt ASP.NET Core-projekt fut a Visual Studióban.

Az ideiglenes alagút akkor megfelelő, ha a fejlesztői alagút URL-címének rövid ideig működnie kell. Például, folyamatban lévő munka megosztása másokkal egy webalkalmazáson vagy egy alkalmazás tesztelése külső eszközön. Bizonyos esetekben a Visual Studio minden indításakor célszerű új URL-címet kapni.

Lásd még

A következő erőforrások a fejlesztői alagutak funkció előzetes verziójú verzióját használják, így ezek részei elavultak:

• Fejlesztői alagutak használata a Visual Studióban a webes API-k hibakereséséhez
• ACS Call Automation és Azure OpenAI szolgáltatás
• A Visual Studio fejlesztési alagutak segítségével kezelheti a Twilio Webhookokat.