☰

在同一服务器上将 nginx 设置为多个 ReactJS 应用程序时出错？

tag-icon • tag-icon nginx webserver
在同一服务器上将 nginx 设置为多个 ReactJS 应用程序时出错？

我正在构建一个包含多个模块的解决方案。每个模块都是一个 ReactJs 应用程序，我尝试配置 nginx 将其发布到同一域上。举些例子：

http://应用程序域/授权
http://应用程序域/行政
http://应用程序域/仪表板
http://应用程序域/销售量

我的 nginx 公共目录如下：

|---/var/www
|----/auth
|----/admin
|----/dashboard
|----/sales

其中 auth、admin、dashboard 和 sales 是每个项目的子文件夹。

我的 nginx 服务器配置：

server {
 listen 9000 default_server;
 listen [::]:9000 default_server;
 server_name localhost;

 index index.html;

 location / {
    root /var/www/auth;
 }

 location /admin { 
   root /var/www;
 }

 location /dashboard {
   root /var/www;
 }

 location /sales {
   root /var/www;
 }
}

每个项目的子文件夹都有类似的结构，如下所示

在此输入图像描述

问题是当访问http://应用程序域/admin，例如，应用程序尝试加载根目录而不是子文件夹项目上的静态文件

GET http://localhost:9000/static/js/main.6314dcaa.js net::ERR_ABORTED

正确的做法是获取文件行政子文件夹如下：

GET http://localhost:9000/admin/static/js/main.6314dcaa.js

对此纠正 nginx 配置的更好方法是什么？

答案1

我认为您想要完成的任务可以通过扩展每个位置的根部分来完成，如下所示：

 location /admin { 
   root /var/www/admin;
 }

 location /dashboard {
   root /var/www/dashboard;
 }

 location /sales {
   root /var/www/sales;
 }

但这与仅拥有相同

location / {
  root /var/www/
}

因为对 的调用http://application-domain/admin将评估为/var/www/admin.

第一个解决方案将隐藏其他任何内容，/var/www/因为没有位置规则可以访问 say http://application-domain/private。

相关内容