nginx部署多前端项⽬的⼏种⽅法
个⼈总结了3种⽅法来实现在⼀台服务器上使⽤nginx部署多个前端项⽬的⽅法。
基于域名配置
基于端⼝配置
基于location配置
在正式开始之前，我们先来看⼀下nginx安装的默认配置⽂件： /etc/f ⽂件
可以看到图中的：include /usr/nginx/modules/*.conf，这句话的作⽤就是可以在nginx启动加载所有 /usr/nginx/modules/ ⽬录下的 *.conf ⽂件。所以，平时我们为了⽅便管理，可以在此⽬录下⾯定义⾃⼰的xx.conf ⽂件即可。但是注意，⼀定要以.conf 结尾。
介绍完毕，下⾯我们先来说⼀下最常⽤，也是许多公司线上使⽤的⽅式。
基于域名配置
基于域名配置，前提是先配置好了域名解析。⽐如说你⾃⼰买了⼀个域名：www.fly。然后你在后台配置了2个它的⼆级域名： a.fly、 b.fly。
配置⽂件如下：
配置 a.fly 的配置⽂件：
vim /usr/nginx/f
server {
listen 80;
server_name a.fly;
location / {
root /data/web-a/dist;
index index.html;
}
}
配置 b.fly 的配置⽂件：
vim /usr/nginx/f
server {
listen 80;
server_name b.fly;
location / {
root /data/web-b/dist;
index index.html;
}
}
这种⽅式的好处是，主机只要开放80端⼝即可。然后访问的话直接访问⼆级域名就可以访问。
基于端⼝配置
配置⽂件如下：
配置 a.fly 的配置⽂件：
vim /usr/nginx/f
server {
listen 8000;
location / {
root /data/web-a/dist;
index index.html;
}
}
# nginx 80端⼝配置（监听a⼆级域名）
server {
listen  80;
server_name a.fly;
location / {
proxy_pass localhost:8000; #转发
}
}
配置 b.fly 的配置⽂件：
vim /usr/nginx/f
server {
listen 8001;
location / {
root /data/web-b/dist;
index index.html;
}
}
# nginx 80端⼝配置（监听b⼆级域名）
server {
listen  80;
server_name b.fly;
location / {
proxy_pass localhost:8001; #转发
}
}
可以看到，这种⽅式⼀共启动了4个server，⽽且配置远不如第⼀种简单，所以不推荐。
基于location配置
nginx部署前端项目配置⽂件如下：
配置 a.fly 的配置⽂件：
vim /usr/nginx/f
server {
listen 80;
location / {
root /data/web-a/dist;
index index.html;
}
location /web-b {
alias /data/web-b/dist;
index index.html;
}
}
注意：这种⽅式配置的话，location / ⽬录是root，其他的要使⽤alias。
可以看到，这种⽅式的好处就是我们只有⼀个server，⽽且我们也不需要配置⼆级域名。并且前端项⽬⾥要配置⼆级⽬录
到此这篇关于nginx部署多前端项⽬的⼏种⽅法的⽂章就介绍到这了，更多相关nginx部署多前端项⽬内容请搜索以前的⽂章或继续浏览下⾯的相关⽂章希望⼤家以后多多⽀持！

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。