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

Azure App Service ist eine verwaltete Plattform für das 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 mit /api beginnt, an dieselbe 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 stehen für die Verwendung mit Azure Static Web Apps zur Verfügung.

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

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

Hinweis

Die Integration mit Azure-App Service erfordert den Statischen Web-Apps Standardplan.

Back-End-Integration wird in statischen Web-Apps Pullanforderungsumgebungen 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.

Resource 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 keine besitzen, führen Sie die Schritte in der Anleitung zu den ersten Schritten aus, um eine statische Web-App ohne Framework zu erstellen.

Beispiel

Erwägen Sie eine vorhandene Azure-App Dienstinstanz, 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 im App-Dienst muss das /api Präfix aufweisen, da Static Web-Apps Anforderungen /api an und Proxys den gesamten Pfad zur verknüpften Ressource abgleicht.

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 in Abonnement das Abonnement aus, das die Azure App Service-App enthält, die Sie verknüpfen möchten.

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

  7. Link wählen.

Wenn der Verknüpfungsprozess abgeschlossen ist, werden Anforderungen, die mit /api beginnen, zur verknüpften 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, ändern Sie die Authentifizierungskonfiguration, um einen anderen Identitätsanbieter hinzuzufügen, oder ändern Sie die Sicherheitseinstellungen so, dass ein nicht authentifizierter Zugriff zulässig ist.

Führen Sie die folgenden Schritte aus, um die Verknüpfung einer Web-App mit 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, deren Verknüpfung Sie aufheben möchten, und wählen Sie den Namen der Web-App aus.

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

Wenn der Prozess der Aufhebung 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 durch den Verknüpfungsprozess erstellte Identitätsanbieter nicht automatisch gelöscht. Sie können den Identitätsanbieter namens Azure Static Web Apps (Verknüpft) 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