Ćwiczenie — Tworzenie projektu usługi Azure Functions

6 min

Aplikacja internetowa z listą zakupów wymaga interfejsu API. W tym ćwiczeniu utworzysz i uruchomisz interfejs API przy użyciu projektu usługi Azure Functions. Z tego miejsca rozszerzysz interfejs API przy użyciu nowej funkcji przy użyciu rozszerzenia usługi Azure Functions dla programu Visual Studio.

W tym ćwiczeniu wykonasz następujące kroki:

Utwórz gałąź podczas przygotowywania do wprowadzania zmian w aplikacji internetowej.
Zapoznaj się z projektem usługi Azure Functions.
Utwórz funkcję HTTP GET.
Zastąp kod początkowy funkcji logiką, aby pobrać produkty.
Skonfiguruj aplikację internetową do proxy żądań HTTP do interfejsu API.
Uruchom interfejs API i aplikację internetową.

Uwaga

Upewnij się, że skonfigurowano program Visual Studio na potrzeby programowania na platformie Azure przy użyciu platformy .NET.

Pobieranie aplikacji funkcji

Teraz dodasz interfejs API i połączysz go z aplikacją frontonu. Projekt interfejsu API zawiera niekompletny projekt usługi Azure Functions, więc ukończmy to teraz.

Tworzenie gałęzi interfejsu API

Przed wprowadzeniem zmian w aplikacji dobrym rozwiązaniem jest utworzenie nowej gałęzi dla zmian. Zaraz zakończysz tworzenie interfejsu API dla swojej aplikacji, więc utwórz nową gałąź w Git o nazwie api.

Uzupełnianie interfejsu API usługi Azure Functions

Projekt Api zawiera twój projekt Azure Functions wraz z trzema funkcjami.

Klasa	Metoda	Marszruta
ProductsPost	Bez znajomości kontekstu, w którym "POST" jest używany, nie mogę zaproponować dokładnego tłumaczenia. Jeżeli dotyczy HTTP, pozostaw jako "POST".	`products`
ProductsPut	ODŁÓŻ	`products/:id`
ProductsDelete	USUŃ	`products/:id`

Interfejs API ma trasy do manipulowania produktami na liście zakupów, ale nie ma trasy do pobierania produktów. Dodajmy to dalej.

Tworzenie funkcji HTTP GET

W programie Visual Studio kliknij prawym przyciskiem myszy projekt Api , a następnie wybierz polecenie Dodaj>nowy element.
W oknie dialogowym Dodawanie nowego elementu wybierz pozycję Funkcja platformy Azure.
Wprowadź ProductsGet.cs jako nazwę pliku funkcji.
Wybierz HTTP trigger jako typ funkcji.
Wybierz pozycję Anonimowe z listy rozwijanej w polu Poziom autoryzacji .
Wybierz pozycję Dodaj.

Właśnie rozszerzono aplikację usługi Azure Functions za pomocą funkcji , aby uzyskać produkty!

Konfigurowanie metody HTTP i punktu końcowego trasy

Zwróć uwagę, że Run metoda nowo utworzonej klasy języka C# ma HttpTrigger atrybut w pierwszym argumencie HttpRequest. Ten atrybut definiuje poziom dostępu funkcji, metody HTTP do nasłuchiwania i punkt końcowy trasy.

Punkt końcowy trasy jest null domyślnie, co oznacza, że punkt końcowy używa wartości atrybutu FunctionName , czyli ProductsGet. Route Ustawienie właściwości w celu "products" zastąpienia domyślnego zachowania.

Obecnie funkcja jest wyzwalana przy żądaniu HTTP GET do produktów. Metoda Run wygląda podobnie do następującego kodu:

[FunctionName("ProductsGet")]
public static async Task<IActionResult> Run(
    [HttpTrigger(AuthorizationLevel.Anonymous, "get", "post", Route = null)] HttpRequest req,
    ILogger log)

Aktualizowanie logiki trasy

Treść Run metody jest wykonywana po wykonaniu funkcji.

Aby uzyskać produkty, należy zaktualizować logikę w metodzie Run . W pliku znajduje się logika ProductData.cs dostępu do danych o nazwie ProductData, która jest dostępna za pośrednictwem wstrzykiwania zależności jako interfejsu IProductData . Interfejs zawiera metodę o nazwie GetProducts, która zwraca Task<IEnumerable<Product> asynchronicznie zwraca listę produktów.

Teraz zmień punkt końcowy funkcji, aby zwracał produkty:

Otwórz ProductsGet.cs.

Zastąp zawartość poniższym kodem:

using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Mvc;
using Microsoft.Azure.WebJobs;
using Microsoft.Azure.WebJobs.Extensions.Http;
using System.Threading.Tasks;

namespace Api;

public class ProductsGet
{
    private readonly IProductData productData;

    public ProductsGet(IProductData productData)
    {
        this.productData = productData;
    }

    [FunctionName("ProductsGet")]
    public async Task<IActionResult> Run(
        [HttpTrigger(AuthorizationLevel.Anonymous, "get", Route = "products")] HttpRequest req)
    {
        var products = await productData.GetProducts();
        return new OkObjectResult(products);
    }
}

W poprzednich zmianach klasa zmieniła się ze statycznej na klasę wystąpienia. Dodano interfejs do konstruktora, aby platforma wstrzykiwania zależności mogła wstrzyknąć klasę ProductData . Na koniec skonfigurowano Run funkcję tak, aby zwracała listę produktów po wywołaniu.

Nie musisz martwić się o współużytkowanie zasobów między źródłami (CORS) podczas publikowania w usłudze Azure Static Web Apps. Usługa Azure Static Web Apps automatycznie konfiguruje aplikację, tak aby mogła komunikować się z interfejsem API na platformie Azure przy użyciu zwrotnego serwera proxy. Jednak w przypadku uruchamiania lokalnego należy skonfigurować mechanizm CORS, aby umożliwić komunikację aplikacji internetowej i interfejsu API.

Teraz monituj usługę Azure Functions o zezwolenie aplikacji internetowej na wykonywanie żądań HTTP do interfejsu API na komputerze.

Otwórz plik o nazwie launchSettings.json w folderze Właściwości projektu api .
- Jeśli plik nie istnieje, utwórz go.

Zaktualizuj zawartość pliku:

{
    "profiles": {
        "Api": {
            "commandName": "Project",
            "commandLineArgs": "start --cors *"
        }
    }
}

Uwaga

Ten plik służy do kontrolowania sposobu uruchamiania narzędzi usługi Azure Functions przez program Visual Studio. Jeśli chcesz użyć narzędzia wiersza polecenia usługi Azure Functions, potrzebujesz również pliku local.settings.json opisanego w dokumentacji narzędzi Azure Functions Core Tools. Plik local.settings.json jest wymieniony w pliku gitignore , co uniemożliwia wypchnięcie tego pliku do usługi GitHub. Jest to spowodowane tym, że w tym pliku można przechowywać wpisy tajne, których nie potrzebujesz w usłudze GitHub. Dlatego też trzeba było utworzyć plik podczas tworzenia repozytorium na podstawie szablonu.

Uruchamianie interfejsu API i aplikacji internetowej

Teraz nadszedł czas, aby obejrzeć pracę aplikacji internetowej i projektu usługi Azure Functions.

W programie Visual Studio kliknij prawym przyciskiem myszy rozwiązanie ShoppingList .
Wybierz pozycję Konfiguruj projekty startowe.
Wybierz opcję Wiele projektów startowych .
Ustaw Api i Client tak, aby miały Uruchom jako akcję, a następnie wybierz Ok.
Uruchom debuger.

Przeglądanie aplikacji

Nadszedł czas, aby zobaczyć, że aplikacja działa lokalnie, korzystając z interfejsu API usługi Azure Functions.

Przejdź do aplikacji internetowej (na przykład https://localhost:44348/).

Utworzono aplikację, a teraz działa ona lokalnie, wysyłając żądania HTTP GET do interfejsu API.

Teraz zatrzymaj uruchomioną aplikację i interfejs API, rozłączając debuger w programie Visual Studio.

Następne kroki

Aplikacja działa lokalnie, a następnym krokiem jest opublikowanie aplikacji razem z interfejsem API.

Sprzężenie zwrotne

Czy ta strona była pomocna?