Freigeben über


API-Unterstützung in Azure Static Web Apps mit Azure App Service

Azure App Service ist eine verwaltete Plattform zum Hosten von Webanwendungen, die Code auf Servern ausführen. Azure App Service unterstützt viele Laufzeiten und Frameworks, einschließlich Node.js, ASP.NET Core, PHP, Java und Python.

Wenn Sie Ihre Azure App Service-Web-App mit Ihrer statischen Web-App verknüpfen, werden alle Anforderungen an Ihre statische Web-App mit einer Route, die beginnt /api , an die gleiche Route in der Azure App Service-App weitergeleitet.

Wenn eine App Service-App mit einer statischen Web-App verknüpft ist, akzeptiert die App Service-App standardmäßig nur Anforderungen, die über die verknüpfte statische Web-App weitergeleitet werden. Eine Azure App Service-App kann jeweils nur mit einer einzigen statischen Web-App verknüpft werden.

Alle Azure App Service-Hostingpläne sind für die Verwendung mit Azure Static Web Apps verfügbar.

API-Optionen für Static Web Apps umfassen die folgenden Azure-Dienste:

Weitere Informationen finden Sie in der Übersicht über APIs.

Hinweis

Für die Integration mit Azure App Service ist der Standardplan "Static Web Apps" erforderlich.

Die Backendintegration wird in Static Web Apps Pull Request-Umgebungen nicht unterstützt.

Voraussetzungen

Um einen App-Dienst mit Ihrer statischen Web-App zu verknüpfen, müssen Sie über eine vorhandene App Service-Ressource und eine statische Web-App verfügen.

Ressource Beschreibung
Azure App Service Wenn Sie noch keins haben, führen Sie die Schritte im Leitfaden zum Erstellen einer Web-App in Azure aus .
Vorhandene statische Web-App Wenn Sie noch keins haben, führen Sie die Schritte im Leitfaden für die ersten Schritte aus, um eine statische No Framework-Web-App zu erstellen.

Beispiel

Erwägen Sie eine vorhandene Azure App Service-Instanz, die einen Endpunkt über den folgenden Speicherort verfügbar macht.

https://my-web-app.azurewebsites.net/api/getProducts

Nach der Verknüpfung können Sie von Ihrer statischen Web-App über den api-Pfad auf denselben Endpunkt zugreifen, wie in dieser Beispiel-URL gezeigt.

https://red-sea-123.azurestaticapps.net/api/getProducts

Beide URLs verweisen auf denselben API-Endpunkt. Der Endpunkt des App-Dienstes muss das /api-Präfix aufweisen, da Static Web Apps Anfragen an /api weiterleitet und den gesamten Pfad an die verknüpfte Ressource weitergibt.

Führen Sie die folgenden Schritte aus, um eine Web-App als API-Back-End für eine statische Web-App zu verknüpfen:

  1. Wechseln Sie im Azure-Portal zur statischen Web-App.

  2. Wählen Sie im Navigationsmenü APIs aus.

  3. Suchen Sie die Umgebung, mit der Sie die API Management-Instanz verknüpfen möchten. Link wählen.

  4. Wählen Sie im Back-End-RessourcentypWeb App aus.

  5. Wählen Sie im Abonnement das Abonnement aus, das die Azure App Service-App enthält, die Sie verknüpfen möchten.

  6. Wählen Sie unter "Ressourcenname" die Azure App Service-App aus.

  7. Link wählen.

Wenn der Verknüpfungsprozess abgeschlossen ist, werden Anforderungen an Routen, die mit /api beginnen, an die verknüpfte App Service-App weitergeleitet.

Verwalten des Zugriffs auf Azure App Service

Ihre App Service-App ist mit einem Identitätsanbieter namens Azure Static Web Apps (Linked) konfiguriert, der nur Datenverkehr zulässt, der über die statische Web-App weitergeleitet wird. Um Ihre App Service-App für andere Anwendungen zugänglich zu machen, aktualisieren Sie die Authentifizierungskonfiguration so, dass ein anderer Identitätsanbieter hinzugefügt wird, oder ändern Sie die Sicherheitseinstellungen, um den nicht authentifizierten Zugriff zu ermöglichen.

Führen Sie die folgenden Schritte aus, um die Verknüpfung einer Web-App aus einer statischen Web-App aufzuheben:

  1. Wechseln Sie im Azure-Portal zur statischen Web-App.

  2. Wählen Sie im Navigationsmenü APIs aus.

  3. Suchen Sie die Umgebung, die Sie trennen möchten, und wählen Sie den Namen der Web-App aus.

  4. Wählen Sie Verknüpfung aufheben aus.

Wenn der Vorgang zum Aufheben der Verknüpfung abgeschlossen ist, werden Anforderungen an Routen, die mit /api beginnen, nicht mehr an Ihre App Service-App weitergeleitet.

Hinweis

Um zu verhindern, dass Ihre App Service-App versehentlich anonymem Datenverkehr ausgesetzt wird, wird der vom Verknüpfungsprozess erstellte Identitätsanbieter nicht automatisch gelöscht. Sie können den Identitätsanbieter namens Azure Static Web Apps (Linked) aus den Authentifizierungseinstellungen der App Service-App löschen.

Entfernen der Authentifizierung aus der App Service-Ressource

Führen Sie die folgenden Schritte aus, um die App Service-Ressource für den Empfang anonymen Datenverkehrs zu aktivieren, um den Identitätsanbieter zu entfernen:

  1. Navigieren Sie im Azure-Portal zur App Service-Ressource.

  2. Wählen Sie im Navigationsmenü die Option Authentifizierung aus.

  3. Löschen Sie aus der Liste der Identitätsanbieter den Identitätsanbieter im Zusammenhang mit der Static Web Apps-Ressource.

  4. Wählen Sie "Authentifizierung entfernen" aus, um die Authentifizierung zu entfernen und anonymen Datenverkehr für Ihre App Service-Ressource zuzulassen.

Ihre App Service-Ressource kann jetzt anonymen Datenverkehr empfangen.

Nächste Schritte