Utilisez nginx pour déployer plusieurs projets frontaux
Résume personnellement 3 méthodes pour réaliser le déploiement de plusieurs projets frontaux à l'aide de nginx sur un serveur.
- Configuration basée sur le domaine
- Configuration basée sur les ports
- Basé sur la configuration de l'emplacement
Avant de commencer officiellement, jetons un œil au fichier de configuration par défaut installé par nginx:
Comme vous pouvez le voir dans l'image:, include /usr/nginx/modules/*.confla fonction de cette phrase est de charger tous les fichiers * .conf dans le répertoire / usr / nginx / modules / au démarrage de nginx. Par conséquent, afin de faciliter la gestion, nous pouvons définir notre propre fichier xx.conf sous ce répertoire. Mais notez qu'il doit se terminer par .conf.
Après l'introduction, parlons d'abord des plus utilisées et du nombre d'entreprises qui l'utilisent en ligne.
Configuration basée sur le domaine
Sur la base de la configuration du nom de domaine, la prémisse est que la résolution du nom de domaine est configurée en premier. Par exemple, si vous avez acheté vous-même un nom de domaine: www.fly.com. Vous configurez ensuite 2 noms de domaine de second niveau en arrière-plan: a.fly.com, b.fly.com.
Le fichier de configuration est le suivant:
- Configurez le fichier de configuration de a.fly.com:
vim /usr/nginx/modules/a.conf
server {
listen 80;
server_name a.fly.com;
location / {
root /data/web-a/dist;
index index.html;
}
}
- Configurez le fichier de configuration de b.fly.com:
vim /usr/nginx/modules/b.conf
server {
listen 80;
server_name b.fly.com;
location / {
root /data/web-b/dist;
index index.html;
}
}
L'avantage de cette méthode est que l'hôte n'a besoin que d'ouvrir le port 80. Ensuite, si vous visitez, vous pouvez accéder directement au nom de domaine de deuxième niveau.
Configuration basée sur les ports
Le fichier de configuration est le suivant:
- Configurez le fichier de configuration de a.fly.com:
vim /usr/nginx/modules/a.conf
server {
listen 8000;
location / {
root /data/web-a/dist;
index index.html;
}
}
# nginx 80端口配置 （监听a二级域名）
server {
listen 80;
server_name a.fly.com;
location / {
proxy_pass http://localhost:8000; #转发
}
}
- Configurez le fichier de configuration de b.fly.com:
vim /usr/nginx/modules/b.conf
server {
listen 8001;
location / {
root /data/web-b/dist;
index index.html;
}
}
# nginx 80端口配置 （监听b二级域名）
server {
listen 80;
server_name b.fly.com;
location / {
proxy_pass http://localhost:8001; #转发
}
}
On peut voir qu'un total de 4 serveurs sont démarrés de cette manière, et la configuration est beaucoup moins simple que la première, donc ce n'est pas recommandé.
Basé sur la configuration de l'emplacement
Le fichier de configuration est le suivant:
- Configurez le fichier de configuration de a.fly.com:
vim /usr/nginx/modules/ab.conf
server {
listen 80;
location / {
root /data/web-a/dist;
index index.html;
}
location /web-b {
alias /data/web-b/dist;
index index.html;
}
}
Remarque: S'il est configuré de cette manière, l'emplacement / le répertoire est root et l'autre utilise un alias.
Comme vous pouvez le voir, l'avantage de cette méthode est que nous n'avons qu'un seul serveur, et nous n'avons pas besoin de configurer un nom de domaine de deuxième niveau. Et pour configurer dans le projet frontal二级目录
Pour la configuration de React, veuillez vous référer à: https://blog.csdn.net/mollerlala/article/details/96427751?depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromBaidu-2&utm_source=distribute.pc_relevask.n -BlogCommendFromBaidu-2
Veuillez vous référer à la configuration de vue: https://blog.csdn.net/weixin_33868027/article/details/92139392