Vývoj pro víc služeb prostory Azure DevMulti-service development with Azure Dev Spaces

V tomto kurzu se naučíte vyvíjet víc služeb aplikací s použitím Azure Dev mezery, společně s dalšími výhodami, které poskytuje vývoje prostorů.In this tutorial, you'll learn how to develop multi-service applications using Azure Dev Spaces, along with some of the added benefits that Dev Spaces provides.

Volání služby spuštěné v samostatném kontejneruCall a service running in a separate container

V této části se vytvoří druhé služby mywebapia mít webfrontend jeho volání.In this section, you will create a second service, mywebapi, and have webfrontend call it. Každá služba poběží v samostatném kontejneru.Each service will run in separate containers. Ladění bude probíhat v obou kontejnerech.You'll then debug across both containers.

Více kontejnerů

Stažení ukázkového kódu pro mywebapiDownload sample code for mywebapi

Kvůli úspoře času si můžete ukázkový kód stáhnout z úložiště GitHub.For the sake of time, let's download sample code from a GitHub repository. Přejděte na https://github.com/Azure/dev-spaces a stáhněte si úložiště GitHub výběrem možnosti Clone or Download (Klonovat nebo stáhnout).Go to https://github.com/Azure/dev-spaces and select Clone or Download to download the GitHub repository. Kód k této části je tady: samples/dotnetcore/getting-started/mywebapi.The code for this section is in samples/dotnetcore/getting-started/mywebapi.

Spuštění mywebapiRun mywebapi

  1. V samostatném okně editoru VS Code otevřete složku mywebapi.Open the folder mywebapi in a separate VS Code window.
  2. Otevřete paletu příkazů (pomocí nabídky Zobrazit | Paleta příkazů) a pomocí automatického dokončování zadejte a vyberte tento příkaz: Azure Dev Spaces: Prepare configuration files for Azure Dev Spaces.Open the Command Palette (using the View | Command Palette menu), and use auto-complete to type and select this command: Azure Dev Spaces: Prepare configuration files for Azure Dev Spaces. Nezaměňujte tento příkaz s příkazem azds prep, který projekt nakonfiguruje pro nasazení.This command is not to be confused with the azds prep command, which configures the project for deployment.
  3. Stiskněte F5 a počkejte na sestavení a nasazení služby.Hit F5, and wait for the service to build and deploy. Poznáte to bude připravené při spuštění aplikace. Stisknutím kláves Ctrl + C vypnout.You'll know it's ready when the Application started. Press Ctrl+C to shut down. zpráva se zobrazí v konzole ladění.message appears in the debug console.
  4. Adresa URL koncového bodu bude přibližně takto: http://localhost:<portnumber>.The endpoint URL will look something like http://localhost:<portnumber>. Tip: Stavový řádek VS Code se zobrazí po kliknutí adresy URL.Tip: The VS Code status bar will display a clickable URL. I když to vypadá, že kontejner je spuštěný lokálně, ve skutečnosti je spuštěný ve vývojovém prostoru v Azure.It might seem like the container is running locally, but actually it is running in our dev space in Azure. Důvodem adresy místního hostitele je, že služba mywebapi nemá definované veřejné koncové body, a proto je přístupná jenom z instance Kubernetes.The reason for the localhost address is because mywebapi has not defined any public endpoints and can only be accessed from within the Kubernetes instance. Kvůli jednodušší práci a interakci se soukromou službou z místního počítače vytvoří Azure Dev Spaces do kontejneru se spuštěným Azure dočasný tunel SSH.For your convenience, and to facilitate interacting with the private service from your local machine, Azure Dev Spaces creates a temporary SSH tunnel to the container running in Azure.
  5. Až bude služba mywebapi připravená, otevřete v prohlížeči adresu místního hostitele.When mywebapi is ready, open your browser to the localhost address. Pokud chcete volat výchozí GET API pro ValuesController, připojte k URL kontroler /api/values.Append /api/values to the URL to invoke the default GET API for the ValuesController.
  6. Pokud byly všechny kroky úspěšné, měla by se zobrazit odpověď služby mywebapi.If all the steps were successful, you should be able to see a response from the mywebapi service.

Vytvoření požadavku z webfrontend do mywebapiMake a request from webfrontend to mywebapi

Teď napíšeme kód v projektu webfrontend, který vygeneruje požadavek do mywebapi.Let's now write code in webfrontend that makes a request to mywebapi.

  1. Přepněte se do okna editoru VS Code s projektem webfrontend.Switch to the VS Code window for webfrontend.

  2. Nahraďte kód pro metodu o v HomeController.cs:Replace the code for the About method in HomeController.cs:

    public async Task<IActionResult> About()
    {
        ViewData["Message"] = "Hello from webfrontend";
    
        using (var client = new System.Net.Http.HttpClient())
            {
                // Call *mywebapi*, and display its response in the page
                var request = new System.Net.Http.HttpRequestMessage();
                request.RequestUri = new Uri("http://mywebapi/api/values/1");
                if (this.Request.Headers.ContainsKey("azds-route-as"))
                {
                    // Propagate the dev space routing header
                    request.Headers.Add("azds-route-as", this.Request.Headers["azds-route-as"] as IEnumerable<string>);
                }
                var response = await client.SendAsync(request);
                ViewData["Message"] += " and " + await response.Content.ReadAsStringAsync();
            }
    
        return View();
    }
    

Předchozí příklad kódu předává hlavičku azds-route-as z příchozího požadavku do odchozího požadavku.The preceding code example forwards the azds-route-as header from the incoming request to the outgoing request. Zobrazí se vám později jak to pomáhá týmům spolupráce na vývoji.You'll see later how this helps teams with collaborative development.

Ladění více služebDebug across multiple services

  1. V této fázi byste měli mít spuštěnou službu mywebapi s připojeným ladicím programem.At this point, mywebapi should still be running with the debugger attached. Pokud tomu tak není, stiskněte v projektu mywebapi klávesu F5.If it is not, hit F5 in the mywebapi project.
  2. Nastavte zarážku v metodě Get(int id), která zpracovává požadavky GET api/values/{id}.Set a breakpoint in the Get(int id) method that handles api/values/{id} GET requests.
  3. V projektu webfrontend nastavte zarážku těsně před odesláním požadavku GET do mywebapi/api/values.In the webfrontend project, set a breakpoint just before it sends a GET request to mywebapi/api/values.
  4. V projektu webfrontend stiskněte klávesu F5.Hit F5 in the webfrontend project.
  5. Otevřete webovou aplikaci a projděte kód obou služeb.Invoke the web app, and step through code in both services.
  6. Ve webové aplikaci na stránce o se zobrazí zpráva zřetězit dvě služby: "Hello webfrontend a Hello z mywebapi."In the web app, the About page will display a message concatenated by the two services: "Hello from webfrontend and Hello from mywebapi."

Automatické trasování pro zprávy protokolu HTTPAutomatic tracing for HTTP messages

Mohli jste si všimnout, že i když webfrontend neobsahuje všechny speciální kód, který vytiskne provádí volání HTTP mywebapi, můžete zobrazit zprávy v okně výstup trasování protokolu HTTP:You may have noticed that, although webfrontend does not contain any special code to print out the HTTP call it makes to mywebapi, you can see HTTP traces messages in the output window:

// The request from your browser
default.webfrontend.856bb3af715744c6810b.eus.azds.io --gyk-> webfrontend:
   GET /Home/About HTTP/1.1

// *webfrontend* reaching out to *mywebapi*
webfrontend-668b7ddb9f-n5rhj --pu5-> mywebapi:
   GET /api/values/1 HTTP/1.1

// Response from *mywebapi*
webfrontend-668b7ddb9f-n5rhj <-pu5-- mywebapi:
   HTTP/1.1 200 OK
   Hello from mywebapi

// Response from *webfrontend* to your browser
default.webfrontend.856bb3af715744c6810b.eus.azds.io <-gyk-- webfrontend:
   HTTP/1.1 200 OK
   <!DOCTYPE html>
   <html>
   <head>
       <meta charset="utf-8" />
       <meta name="viewport" content="width=device-width, initial-sc...<[TRUNCATED]>

Toto je jednou z výhod "free", který jste získali z instrumentace Dev mezery. Jsme vložit součásti, které sledují požadavky HTTP, které procházejí systému zjednodušit sledování hovorů komplexní víc služeb během vývoje.We insert components that track HTTP requests as they go through the system to make it easier for you to track complex multi-service calls during development.

Hotovo!Well done!

Teď máte aplikaci s více kontejnery, kde můžete každý kontejner vyvíjet a nasazovat odděleně.You now have a multi-container application where each container can be developed and deployed separately.

Další postupNext steps