☰

同じサーバー上の複数の ReactJS アプリに nginx をセットアップするとエラーが発生しますか?

tag-icon • tag-icon nginx webserver
同じサーバー上の複数の ReactJS アプリに nginx をセットアップするとエラーが発生しますか?

複数のモジュールを含むソリューションを構築しています。各モジュールは 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/たとえばにアクセスするための場所のルールがないため、の他のものはすべて非表示になりますhttp://application-domain/private。

関連情報