javascript - Comment déployer un projet avec un front-end et un back-end séparés entre vue.js et node.js sur le serveur Ubuntu

Question

Le projet est un projet avec front end et back end séparés. Le code du front end du client, le front end et le back end du système de gestion (les interfaces API du client et du backend de gestion sont écrites en même temps) sont en trois dossiers, correspondant à trois référentiels github.
Dans l'environnement de développement : j'ai ouvert le serveur de code back-end sur le port 3000, ouvert deux serveurs de code front-end sur 8080 et 8081 respectivement et implémenté des demandes d'interfaces entre domaines vers le port 3000 pour le développement.
Comment déployer un tel projet dans le serveur ? J'utilise pm2
Mon attente est la suivante :
Mettez le code backend dans le dossier /www/backend/, configurez nginx pour que l'interface soit accessible via l'url : 'api.xxx.com/...'.
Comment dois-je déployer mes deux projets front-end en ce moment ? Le projet frontal est construit via vue-cli, et un dossier dist contenant index.html et des fichiers statiques peut être obtenu via npm build. Deux dossiers /www/frontend/ et /www/manager/ sont-ils créés sur le serveur pour le stockage ? Comment nginx doit-il être configuré pour accéder à index.html dans ces deux projets front-end et accéder à l'interface back-end en même temps ? Dois-je écrire un total de trois fichiers de configuration nginx ?

Answer 1

Deux projets front-end peuvent être configurés avec deux serveurs et écouter différents ports. Une seule configuration nginx suffit.

Supplément

Answer 2

server {
  listen   8080;
  root /www/fontend;
  index index.html;

  server_name xxx.com www.xxx.com;

  location / {
    try_files $uri $uri/ /index.html;
  }

  location /api/ {
    proxy_redirect off;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded $proxy_add_x_forwarded_for;
    proxy_pass http://127.0.0.1:3000/api/;
  }
}

La configuration frontale de Nginx peut faire référence à ceci.

Recommandations :
1. Le serveur back-end n'a besoin de s'exécuter que sur le 127.0.0.1 local
2 Le nginx frontal configure le proxy inverse pour accéder à l'interface API
3.