API-ondersteuning in Azure Static Web Apps met Azure-app Service
Azure-app Service is een beheerd platform voor het hosten van webtoepassingen die code uitvoeren op servers. Azure-app Service ondersteunt veel runtimes en frameworks, waaronder Node.js, ASP.NET Core, PHP, Java en Python.
Wanneer u uw Azure-app Service-web-app koppelt aan uw statische web-app, worden aanvragen naar uw statische web-app met een route die begint met /api
dezelfde route in de Azure-app Service-app geproxieerd.
Wanneer een App Service-app is gekoppeld aan een statische web-app, accepteert de App Service-app standaard alleen aanvragen die via de gekoppelde statische web-app worden geproxied. Een Azure-app Service-app kan slechts worden gekoppeld aan één statische web-app tegelijk.
Alle Azure-app Service-hostingabonnementen zijn beschikbaar voor gebruik met Azure Static Web Apps.
API-opties voor Static Web Apps omvatten de volgende Azure-services:
Zie het overzicht van API's voor meer informatie.
Notitie
Voor de integratie met Azure-app Service is het Static Web Apps Standard-plan vereist.
Back-endintegratie wordt niet ondersteund in statische Web Apps-pull-aanvraagomgevingen.
Vereisten
Als u een App Service wilt koppelen aan uw statische web-app, moet u een bestaande App Service-resource en een statische web-app hebben.
Bron | Omschrijving |
---|---|
Azure App Service | Als u nog geen web-app hebt, volgt u de stappen in de handleiding Een web-app maken in Azure . |
Bestaande statische web-app | Als u er nog geen hebt, volgt u de stappen in de aan de slag-handleiding om een statische Web-app van No Framework te maken. |
voorbeeld
Overweeg een bestaand Azure-app Service-exemplaar dat een eindpunt beschikbaar maakt via de volgende locatie.
https://my-web-app.azurewebsites.net/api/getProducts
Zodra de koppeling is gemaakt, hebt u toegang tot hetzelfde eindpunt via het api
pad vanuit uw statische web-app, zoals wordt weergegeven in deze voorbeeld-URL.
https://red-sea-123.azurestaticapps.net/api/getProducts
Beide URL's verwijzen naar hetzelfde API-eindpunt. Het eindpunt op de App Service moet het /api
voorvoegsel hebben, omdat Static Web Apps overeenkomt met aanvragen voor /api
en proxy's het volledige pad naar de gekoppelde resource.
Een Azure-app Service-web-app koppelen
Als u een web-app wilt koppelen als de API-back-end voor een statische web-app, voert u de volgende stappen uit:
Ga in Azure Portal naar de statische web-app.
Selecteer API's in het navigatiemenu.
Zoek de omgeving waarnaar u het API Management-exemplaar wilt koppelen. Selecteer Koppeling.
Selecteer Web-app in het resourcetype Back-end.
Selecteer in Abonnement het abonnement met de Azure-app Service-app die u wilt koppelen.
Selecteer in Resourcenaam de Azure-app Service-app.
Selecteer Koppeling.
Wanneer het koppelingsproces is voltooid, worden aanvragen naar routes die /api
beginnen met de gekoppelde App Service-app geproxied.
Toegang tot Azure-app Service beheren
Uw App Service-app is geconfigureerd met een id-provider die Azure Static Web Apps (Linked)
alleen verkeer toestaat dat wordt geproxied via de statische web-app. Als u uw App Service-app toegankelijk wilt maken voor andere toepassingen, werkt u de verificatieconfiguratie bij om een andere id-provider toe te voegen of wijzigt u de beveiligingsinstellingen om niet-geverifieerde toegang toe te staan.
Een Azure-app Service-app ontkoppelen
App Service ontkoppelen vanuit Static Web Apps
Volg deze stappen om een web-app los te koppelen van een statische web-app:
Ga in Azure Portal naar de statische web-app.
Selecteer API's in het navigatiemenu.
Zoek de omgeving die u wilt ontkoppelen en selecteer de naam van de web-app.
Selecteer Ontkoppelen.
Wanneer het ontkoppelingsproces is voltooid, worden aanvragen om te routes die beginnen, /api
niet meer naar uw App Service-app geproxied.
Notitie
Om te voorkomen dat uw App Service-app per ongeluk beschikbaar wordt gemaakt voor anoniem verkeer, wordt de id-provider die door het koppelingsproces is gemaakt, niet automatisch verwijderd. U kunt de id-provider met de naam Azure Static Web Apps (gekoppeld) verwijderen uit de verificatie-instellingen van de App Service-app.
Verificatie verwijderen uit de App Service-resource
Volg deze stappen om de id-provider te verwijderen om uw App Service-resource in staat te stellen anoniem verkeer te ontvangen:
Navigeer in Azure Portal naar de App Service-resource.
Selecteer Verificatie in het navigatiemenu.
Verwijder in de lijst met id-providers de id-provider die is gerelateerd aan de Static Web Apps-resource.
Selecteer Verificatie verwijderen om verificatie te verwijderen en anoniem verkeer naar uw App Service-resource toe te staan.
Uw App Service-resource kan nu anoniem verkeer ontvangen.