Comment déployer une application Flask + React sur Azure Web Service
J'ai travaillé sur cette application sur mon hôte local, qui a Flask comme backend ( localhost: 5000 ) et React comme frontal ( localhost: 3000 ), et ils communiquent bien. Maintenant, je suis censé le mettre en ligne afin que d'autres personnes puissent le voir également - je n'avais pas beaucoup d'expérience dans Azure, mais comment puis-je déployer ces deux composants (React & Flask) dans une URL sur le service d'application Web Azure? (Avant, j'avais une certaine expérience dans l'utilisation de FTP pour télécharger le dossier ' build ' dans un dossier " site / wwwroot " pour mettre en place une application React simple sans backend)
Réponses
Le plus récent
Après le test, le projet python est déployé dans l'application web, le projet react est déployé dans l'application virtuelle et le projet de nœud normal est également déployé dans l'application virtuelle.
Déployez le projet flask python dans l'environnement Windows, la méthode de déploiement normale échouera, assurez-vous de suivre ce document de blog (document tiers) pour fonctionner, cela fonctionne pour moi.
Exécution de l'application Flask avec HttpPlatformHandler dans Azure App Services
L'effet est montré sur la figure. Vous pouvez voir que le projet de nœud normal est accessible normalement, mais pas le projet react. Je pense qu'il y a des bugs. ( A soulevé un ticket de support pour confirmer )
La méthode de déploiement de l'application virtuelle est recommandée pour adopter la méthode de publication illustrée dans la figure ci-dessous.
Privé
Il est recommandé de choisir Windows lors de la création d'une application Web Azure, car Windows prend en charge l'application virtuelle.
Nous pouvons déployer l'application Flask normalement et déployer l'application React dans une application virtuelle.
Dans des circonstances normales, l'une process.env.portdes deux applications Web est la même et n'interférera pas l'une avec l'autre en raison du chemin virtuel.
Poste de référence:
1. Vue Frontend et Express backend sur le même service d'application Web Azure
2. Azure Front Door ne gère pas de domaine personnalisé dans le navigateur