Flask + React 애플리케이션을 Azure Web Service에 배포하는 방법

Sep 21 2020

Flask가 백엔드 ( localhost : 5000 )이고 React가 프런트 엔드 ( localhost : 3000 ) 인 내 localhost에서이 앱을 작업 해 왔으며 잘 통신하고 있습니다. 이제 다른 사람도 볼 수 있도록 온라인에 올려야합니다. Azure에 대한 경험이 많지 않은데이 두 구성 요소 (React & Flask)를 Azure 웹 앱 서비스의 하나의 URL에 어떻게 배포 할 수 있습니까? ( 백엔드없이 간단한 React 앱을 만들기 위해 FTP를 사용하여 ' build '폴더를 " site / wwwroot "폴더에 업로드 한 경험이있었습니다. )

답변

1 JasonPan Sep 21 2020 at 08:34

최신

테스트 후 python 프로젝트가 webapp에 배포되고 react 프로젝트가 가상 애플리케이션에 배포되며 일반 노드 프로젝트도 가상 애플리케이션에 배포됩니다.

플라스크 파이썬 프로젝트를 Windows 환경에 배포하면 정상적인 배포 방법이 실패합니다.이 블로그 문서 (타사 문서)를 따라 작동하도록하십시오. 저에게 적합합니다.

Azure App Services에서 HttpPlatformHandler를 사용하여 Flask 앱 실행

효과는 그림에 나와 있습니다. 일반 노드 프로젝트는 정상적으로 접근 할 수 있지만 반응 프로젝트는 접근 할 수 없습니다. 버그가 있다고 생각합니다. ( 확인을 위해 지원 티켓을 제기했습니다 )

가상 응용 프로그램의 배포 방법은 아래 그림과 같은 게시 방법을 채택하는 것이 좋습니다.

이전

Windows는 가상 애플리케이션을 지원하므로 Azure 웹앱을 만들 때 창을 선택하는 것이 좋습니다.

플라스크 앱을 정상적으로 배포하고 가상 앱에 반응 앱을 배포 할 수 있습니다.

정상적인 상황 process.env.port에서 두 웹앱은 동일하며 가상 경로로 인해 서로 간섭하지 않습니다.

참조 게시물 :

1. 동일한 Azure 웹 앱 서비스의 Vue Frontend 및 Express 백엔드

2. Azure Front Door가 브라우저에서 사용자 지정 도메인을 유지하지 않음