Freigeben über

Hostdaten-API-Generator in Azure Static Web Apps (Vorschau)

Diagramm der aktuellen Position ('Veröffentlichen') im Ablauf des Bereitstellungshandbuchs.

Hosten Sie schnell einen API-Builder für Daten in Azure Static Web Apps, indem Sie nur eine Konfigurationsdatei verwenden. Dieses Handbuch enthält Schritte zum Integrieren des Daten-API-Generators in eine statische Web-App.

In diesem Leitfaden werden die Schritte zum Erstellen einer DAB-Konfigurationsdatei erläutert, die Datei als Teil Ihrer Anwendung gehostet und dann eine Datenbankverbindung in Azure Static Web Apps verwendet.

Voraussetzungen

Wichtig

Die Unterstützung für Data API Builder (DAB) in Azure Static Web Apps mit Datenbankverbindungen befindet sich in der Vorschau. Azure Static Web Apps verwendet eine feste Version des DAB-Moduls, die von der neuesten stabilen Version von DAB variieren kann. Um auf die neuesten DAB-Features zuzugreifen, sollten Sie einen alternativen Host für DAB mit der neuesten Version des Moduls von GitHub, Microsoft Container Registry (Docker Hub) oder NuGet in Betracht ziehen.

Erstellen einer statischen Web-App

Verwenden Sie zunächst das Azure-Portal, um eine neue statische Azure Web App mit der Webanwendung in GitHub zu erstellen.

  1. Melden Sie sich beim Azure-Portal an (https://portal.azure.com).

  2. Erstellen Sie eine neue Ressourcengruppe. Sie verwenden diese Ressourcengruppe für alle neuen Ressourcen in diesem Handbuch.

    Screenshot der Seite

    Tipp

    Es wird empfohlen, die Ressourcengruppe msdocs-dab-swazu benennen. Alle Screenshots in diesem Handbuch verwenden diesen Namen.

  3. Erstellen Sie eine statische Azure Web App. Verwenden Sie diese Einstellungen, um die statische Web-App zu konfigurieren.

    Einstellung Wert
    Ressourcengruppe Wählen Sie die Zuvor erstellte Ressourcengruppe aus.
    Name Geben Sie einen global eindeutigen Namen ein.
    Plan-Typ Wählen Sie die beste Option für Ihre Workload aus.
    Source GitHub auswählen
    GitHub-Konto Konfigurieren eines GitHub-Kontos, das Zugriff auf das Webanwendungs-Repository hat
    Organisation Wählen Sie die übergeordnete Organisation oder den übergeordneten Benutzer für das Repository aus
    Repository Auswählen des Repositorynamens
    Branch Wählen Sie den primären Zweig aus

    Screenshot der Registerkarte

  4. Warten Sie, bis die Bereitstellung der statischen Webanwendung abgeschlossen ist. Ihrem Repository wird automatisch ein GitHub Actions-Workflow hinzugefügt, der die Anwendung bei jedem Push an den primären Branch in Azure Static Web Apps bereitstellt.

    Anmerkung

    Diese anfängliche Bereitstellung kann einige Minuten dauern. Sie können immer den Status der Bereitstellung im Azure-Portal oder auf der Registerkarte "GitHub-Aktionen" in Ihrem Repository überprüfen.

  5. Navigieren Sie im Azure-Portal zur neuen statischen Web-App.

  6. Verwenden Sie im Abschnitt Essentials die -URL, um zur laufenden Webanwendung zu navigieren. Stellen Sie sicher, dass die Anwendung wie erwartet ausgeführt wird.

Hinzufügen der DAB-Konfigurationsdatei

Verwenden Sie nun die DAB- und SWA-Befehlszeilenschnittstellen, um eine neue DAB-Konfigurationsdatei zu erstellen und sie dem Webanwendungs-Repository hinzuzufügen.

  1. Öffnen Sie das GitHub-Repository für Ihre Webanwendung in der integrierten Entwicklerumgebung (IDE) Ihrer Wahl.

    Tipp

    Sie können jede beliebige IDE verwenden. Wenn Sie lokal an der Anwendung arbeiten möchten, können Sie das Repository auf Ihrem lokalen Computer klonen. Wenn Sie lieber im Browser arbeiten möchten, können Sie GitHub Codespacesverwenden. Stellen Sie sicher, dass die SWA- und DAB-CLIs in Ihrer Entwicklungsumgebung installiert sind.

  2. Öffnen Sie ein Terminal im Stammverzeichnis des Repositorys.

  3. Verwenden Sie den Befehl swa db aus der SWA CLI, um eine neue DAB-Konfigurationsdatei mit dem angegebenen Datenbanktyp zu initialisieren. Mit dem Befehl wird eine neue Datei namens staticwebapp.database.config.json im ordner swa-db-connections erstellt.

    swa db init --database-type "<database-type>"

    Wichtig

    Einige Datenbanktypen erfordern zusätzliche Konfigurationseinstellungen für die Initialisierung.

  4. Verwenden Sie den Befehl dab add, um der Konfiguration mindestens eine Datenbankentität hinzuzufügen. Konfigurieren Sie jede Entität, um alle Berechtigungen für anonyme Benutzer zuzulassen. Wiederholen Sie dab add beliebig oft für Ihre Elemente.

    dab add "<entity-name>" --source "<schema>.<table>" --permissions "anonymous:*" --config "swa-db-connections/staticwebapp.database.config.json"

  5. Öffnen und überprüfen Sie den Inhalt der Datei "swa-db-connections/staticwebapp.database.config.json".

  6. Committen Sie Ihre Änderungen in das Repository und pushen Sie sie in den primären Branch. Dadurch wird automatisch eine neue Bereitstellung der Webanwendung ausgelöst. Warten Sie, bis diese neueste Bereitstellung abgeschlossen ist, bevor Sie mit diesem Handbuch fortfahren.

Konfigurieren der Datenbankverbindung

Konfigurieren Sie als Nächstes die Datenbankverbindung im Azure-Portal, damit die statische Web-App auf die Datenbank zugreifen kann.

  1. Navigieren Sie erneut im Azure-Portal zur statischen Web-App.

  2. Wählen Sie die Option Datenbankverbindung im Abschnitt Einstellungen des Ressourcenmenüs aus. Wählen Sie dann Vorhandene Datenbank verknüpfen für die Produktionsumgebung aus.

    Screenshot der Option

  3. Verwenden Sie diese Einstellungen im Dialog Verknüpfungsdatenbank, um die Datenbankverbindung zu konfigurieren.

    Einstellung Wert
    Datenbanktyp Wählen Sie denselben Datenbanktyp aus, den Sie beim Erstellen der DAB-Konfigurationsdatei verwendet haben.
    Ressourcengruppe Wählen Sie die Ressourcengruppe aus, die Sie zuvor in diesem Handbuch erstellt haben.
    Ressourcenname Wählen Sie die Datenbankressource aus, die Sie mit der statischen Web-App verknüpfen möchten.
    Datenbankname Geben Sie den Namen der Datenbank ein.
    Authentifizierungstyp Wählen Sie den Typ der Authentifizierung aus, die Sie verwenden möchten.

    Screenshot des Dialogfelds

    Tipp

    Es wird empfohlen, eine Verbindungszeichenfolge zu verwenden, die keine Autorisierungsschlüssel enthält. Verwenden Sie stattdessen verwaltete Identitäten und rollenbasierte Zugriffssteuerung, um den Zugriff zwischen Ihrer Datenbank und Ihrem Host zu verwalten. Weitere Informationen finden Sie unter Azure-Dienste, die verwaltete Identitätenverwenden.

Testen des Daten-API-Endpunkts

Überprüfen Sie abschließend, ob der Daten-API-Endpunkt in der statischen Web-App verfügbar ist.

  1. Navigieren Sie erneut im Azure-Portal zur statischen Web-App.

  2. Verwenden Sie das Feld URL im Abschnitt Essentials, um erneut zur Website der statischen Web App zu navigieren.

  3. Navigieren Sie zum /data-api Pfad für die aktuelle ausgeführte Anwendung. Beachten Sie, dass die Antwort weiterhin angibt, dass der DAB-Container in einwandfreiem Zustandist.

    { Healthy }

    Anmerkung

    Statische Web Apps legen den Laufzeithostmodus automatisch auf Productionfest, wobei alle Werte in der Konfigurationsdatei überschrieben werden. Daher sind Entwicklerfeatures wie Swagger und Banana Cake Pop in Static Web Apps nicht verfügbar.

  4. Navigieren Sie zum https://<your-static-web-app-url>/data-api/<your-rest-path>/<your-entity-name> Pfad für die aktuelle ausgeführte Anwendung. Dadurch wird eine HTTP GET- Anforderung für diese Gruppe von Entitäten ausgesetzt. Beobachten Sie die JSON-Antwort.

Bereinigen von Ressourcen

Wenn Sie die Beispielanwendung oder Ressourcen nicht mehr benötigen, entfernen Sie die entsprechende Bereitstellung und alle Ressourcen.

  1. Navigieren Sie mithilfe des Azure-Portals zur Ressourcengruppe.

  2. Wählen Sie in der BefehlsleisteLöschenaus.

  • Last updated on