Azure App Service를 사용하는 Azure Static Web Apps의 API 지원

Azure App Service 는 서버에서 코드를 실행하는 웹 애플리케이션을 호스팅하기 위한 관리되는 플랫폼입니다. Azure App Service는 Node.js, ASP.NET Core, PHP, Java 및 Python을 비롯한 많은 런타임 및 프레임워크를 지원합니다.

Azure App Service 웹앱을 정적 웹앱에 연결하면 시작하는 /api 경로가 있는 정적 웹앱에 대한 모든 요청이 Azure App Service 앱의 동일한 경로에 프록시됩니다.

기본적으로 App Service 앱이 정적 웹앱에 연결된 경우 App Service 앱은 연결된 정적 웹앱을 통해 프록시되는 요청만 허용합니다. Azure App Service 앱은 한 번에 단일 정적 웹앱에만 연결할 수 있습니다.

모든 Azure App Service 호스팅 계획은 Azure Static Web Apps에서 사용할 수 있습니다.

Static Web Apps 대한 API 옵션에는 다음 Azure 서비스가 포함됩니다.

자세한 내용은 API 개요를 참조하세요.

메모

Azure App Service와 통합하려면 Static Web Apps 표준 계획이 필요합니다.

Static Web Apps 끌어오기 요청 환경에서는 백 엔드 통합이 지원되지 않습니다.

사전 요구 사항

App Service를 정적 웹앱에 연결하려면 기존 App Service 리소스와 정적 웹앱이 있어야 합니다.

Resource 설명
Azure 앱 서비스 아직 없는 경우 Azure에서 웹앱 만들기 가이드의 단계를 따릅니다.
기존 정적 웹앱 아직 없는 경우 시작 가이드의 단계에 따라 프레임워크 없음 정적 웹앱을 만듭니다.

예시

다음 위치를 통해 엔드포인트를 노출하는 기존 Azure App Service 인스턴스를 고려합니다.

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

연결되면 이 예제 URL에 표시된 것처럼 정적 웹앱에서 api 경로를 통해 동일한 엔드포인트에 액세스할 수 있습니다.

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

두 URL 모두 동일한 API 엔드포인트를 가리킵니다. App Service의 엔드포인트에는 /api 접두사가 있어야 합니다. 이는 Static Web Apps가 /api에 대한 요청과 일치한 후, 연결된 리소스로의 전체 경로를 프록시하기 때문입니다.

웹앱을 정적 웹앱의 API 백 엔드로 연결하려면 다음 단계를 수행합니다.

  1. Azure Portal에서 정적 웹앱으로 이동합니다.

  2. 탐색 메뉴에서 API를 선택합니다.

  3. API Management 인스턴스를 연결할 환경을 찾습니다. 링크를 선택합니다.

  4. 백 엔드 리소스 유형에서 웹앱을 선택합니다.

  5. 구독에서 연결하려는 Azure App Service 앱이 포함된 구독을 선택합니다.

  6. 리소스 이름에서 Azure App Service 앱을 선택합니다.

  7. 링크를 선택합니다.

연결 프로세스가 완료되면 연결된 App Service 앱으로 /api 시작하는 경로에 대한 요청이 프록시됩니다.

Azure App Service에 대한 액세스 관리

App Service 앱은 정적 웹앱을 통해 프록시되는 트래픽만 허용하는 ID Azure Static Web Apps (Linked) 공급자로 구성됩니다. App Service 앱을 다른 애플리케이션에서 액세스할 수 있도록 하려면 인증 구성을 업데이트하여 다른 ID 공급자를 추가하거나 인증되지 않은 액세스를 허용하도록 보안 설정을 변경합니다.

정적 웹앱에서 웹앱의 연결을 해제하려면 다음 단계를 수행합니다.

  1. Azure Portal에서 정적 웹앱으로 이동합니다.

  2. 탐색 메뉴에서 API를 선택합니다.

  3. 연결을 해제할 환경을 찾고 웹앱 이름을 선택합니다.

  4. 연결 해제를 선택합니다.

연결 해제 프로세스가 완료되면 시작 /api 경로에 대한 요청이 더 이상 App Service 앱에 프록시되지 않습니다.

메모

App Service 앱을 익명 트래픽에 실수로 노출하지 않도록 하려면 연결 프로세스에서 만든 ID 공급자가 자동으로 삭제되지 않습니다. App Service 앱의 인증 설정에서 Azure Static Web Apps(연결된) 라는 ID 공급자를 삭제할 수 있습니다.

App Service 리소스에서 인증 제거

App Service 리소스가 익명 트래픽을 수신할 수 있도록 하려면 다음 단계에 따라 ID 공급자를 제거합니다.

  1. Azure Portal에서 App Service 리소스로 이동합니다.

  2. 탐색 메뉴에서 인증을 선택합니다.

  3. ID 공급자 목록에서 Static Web Apps 리소스와 관련된 ID 공급자를 삭제합니다.

  4. 인증 제거를 선택하여 인증을 제거하고 App Service 리소스에 대한 익명 트래픽을 허용합니다.

이제 App Service 리소스가 익명 트래픽을 받을 수 있습니다.

다음 단계